关于javascript:fabricjs-如何为Rect设置背景图片

在 Fabric.js 中，您能够为 fabric.Rect 对象设置背景图片。要设置背景图片，您须要创立一个新的 fabric.Pattern 对象，并将其设置为 fabric.Rect 对象的 fill 属性。

例如，以下代码将一个背景图片利用到 fabric.Rect 对象上：

var img = new Image();img.src = 'path/to/image.png';// 期待图像加载实现img.onload = function() {  // 创立一个新的 Pattern 对象  var pattern = new fabric.Pattern({    source: img,    repeat: 'repeat'  });  // 创立一个新的 Rect 对象  var rect = new fabric.Rect({    width: 200,    height: 200,    fill: pattern  });  // 增加 Rect 对象到画布上  canvas.add(rect);};

在这个例子中，咱们创立一个新的 Image 对象，并将其加载实现后创立一个新的 fabric.Pattern 对象。而后，咱们应用 fabric.Rect 构造函数创立一个新的矩形对象，并将其 fill 属性设置为咱们刚刚创立的 fabric.Pattern 对象。最初，咱们将矩形对象增加到画布上。

在 fabric.Pattern 构造函数中，咱们须要指定 source 属性为咱们加载的图像，以及 repeat 属性为 'repeat'，以指定图像如何平铺到矩形上。