Fabric.js 图像 excludeFromExport 属性

在 Fabric.js 中，我们可以使用 excludeFromExport 属性来排除某个对象或组件在导出图片时被导出。这个属性的作用在于我们可以在设计阶段使用一些工具，例如水印或指示器，但不希望在最终导出的图片中出现。

使用方法

要使用 excludeFromExport 属性，您需要在创建对象或组件时将其设置为 true。如下所示：

var watermark = new fabric.Text('Watermark Text', {
  left: 100,
  top: 100,
  fill: '#ffffff',
  fontSize: 30,
  excludeFromExport: true
});

这个示例创建了一个文本对象，它的属性指定了一些文本属性，例如位置、颜色和字体大小。最后一个参数 excludeFromExport 设置为 true，表示这个文本对象在导出图片时将被排除。

您还可以将 excludeFromExport 属性设置为组件。如下所示：

var group = new fabric.Group([], {
  excludeFromExport: true
});

这个示例创建了一个空组件，将它的 excludeFromExport 属性设置为 true。

导出图片

一旦您设置了对象或组件的 excludeFromExport 属性，导出图片时它们将不会出现在导出的图片中。您可以使用 Fabric.js 的 toDataURL 方法来导出图片。

canvas.toDataURL({
  format: 'png',
  quality: 1
});

这个示例使用 Canvas 元素的 toDataURL 方法导出了一张 PNG 格式的图片，并将质量设置为 1。

总结

excludeFromExport 属性是 Fabric.js 中一种非常有用的属性，可以让我们排除在导出图片时不需要显示的对象或组件。我们可以将其设置为 true，然后使用 Canvas 元素的 toDataURL 方法导出图片。