如何用paperJS中的图像填充矩形?

时间:2016-02-28 08:12:29

标签: javascript html5 canvas paperjs

我需要用图像填充矩形。我已经尝试过Raster,但我无法弄清楚如何在画布上创建的矩形中使用栅格。

是否有类似fillColor()方法的函数用图像而不是颜色填充矩形?

任何提示/提示或样本小提琴都会很棒!

1 个答案:

答案 0 :(得分:1)

Here就是你能做的:

// Create your raster:
var url = 'http://assets.paperjs.org/images/marilyn.jpg';
var raster = new Raster(url);
raster.position = new Point(300,300);

// Use clipMask to create a custom polygon clip mask:
var path = new Path.Rectangle(150,150,100,150);
path.clipMask = true;

// It is better to add the path and the raster in a group (but not mandatory)

/*
var group = new Group();
group.addChild(raster);
group.addChild(path);
*/


// If you just need a rectangle part of a raster, you could use getSubRaster(rect) instead:
/*
var subRaster = raster.getSubRaster(new Rectangle(150,150,100,150));
subRaster.position = new Point(600,600);
*/