fabric.js PatternBrush

// Original canvas
const canvas = new fabric.Canvas('canvas');
fabric.Image.fromURL('https://picsum.photos/500/500?image=0', function(oImg) {
    // scale image
  oImg.scale(0.5);
  canvas.add(oImg);
});

canvas.isDrawingMode = true;

const img = new Image();
img.onload = function() {
  var texturePatternBrush = new fabric.PatternBrush(canvas);
  // is it possible to also scale the image here?
  texturePatternBrush.source = img;
  // texturePatternBrush.scale(0.5);
  texturePatternBrush.width = 50;
  texturePatternBrush.height = 50;
  canvas.freeDrawingBrush = texturePatternBrush;
};
img.src = 'https://picsum.photos/500/500?image=0';
<canvas id="canvas" width="500" height="500" ></canvas>

 

posted @ 2018-06-07 23:06  zhishaofei3  阅读(584)  评论(0编辑  收藏  举报