How to set repeating background image for canvas in Fabric JS?

I would like to set the image as the background image for the canvas.

This is possible using the method canvas.setBackgroundImage.

But he does not repeat in the background.

How to make it repeatable?

I saw a demo where a pattern is used to set a repeating background image for text and shapes.

How to use this template for canvas background.?

+4
source share
2 answers

Use a canvas.backgroundColortemplate instead of a background image:

canvas.backgroundColor = new fabric.Pattern({source: image})
+5
source

According to tests related to Fabric.JS, this is possible with backgroundColorsetter without going throughfabric.Pattern

var src = 'img/checker.png';

canvas.setBackgroundColor({source: src, repeat: 'repeat'}, function () {
  canvas.renderAll();
});
+8
source

Source: https://habr.com/ru/post/1544104/


All Articles