Paper.js: Pattern is not supported yet.

Created on 12 Nov 2015 · 4Comments · Source: paperjs/paper.js

in html5 canvas, we can use createPattern() method to create pattern from an image. But I tried to implement this in paperjs. But no luck. It would be very helpful if you add support for adding pattern support.

or is there any way to implement this?

canvas-rendering feature

Source

rajilesh

👍1

All 4 comments

Something like this?

var canvas = document.createElement('canvas');
canvas.width = shape.bounds.width;
canvas.height = shape.bounds.height;
var context = canvas.getContext('2d');
var img = new Image();
img.src = 'pattern.png';
img.onload = function() {
   context.fillStyle = context.createPattern(this,"repeat");
   context.fillRect(0, 0, shape.bounds.width, shape.bounds.height);
   context.fill();
};
var raster = new Raster(canvas,new Point(shape.bounds.x,shape.bounds.y));
raster.fitBounds(shape.bounds, true);
scene2DFloorShape = new Group([shape,raster]);
scene2DFloorShape.clipped = true;
canvas2D.addChild(scene2DFloorShape);