Fabric.js 椭圆 excludeFromExport 属性

在使用 Fabric.js 库时，我们可能需要将对象导出成为图片或者SVG格式的文件。但是有时候，我们不想将某些对象导出，例如辅助线、标记等等。在这种情况下，我们可以使用 Fabric.js 中的 excludeFromExport 属性来实现。

excludeFromExport 属性

excludeFromExport 是 Fabric.js 中的一个对象属性，用于指定对象是否应该被导出。

当我们想要将一个对象排除在导出范围之外时，只需要将该对象的 excludeFromExport 属性设置为 true 即可。

使用方法

var circle = new fabric.Circle({
  radius: 50,
  fill: 'red',
  top: 50,
  left: 50,
  excludeFromExport: true // 设置该对象不被导出
});

canvas.add(circle);

在上述代码中，我们创建了一个红色圆形，并将其 excludeFromExport 属性设置为 true。在导出图片或SVG时，将不会包含该圆形对象。

效果演示

以下是一个效果演示。我们创建了一个带有多个对象的画布，在导出图片时，将排除其中一个矩形对象：

var canvas = new fabric.Canvas('canvas');

var rect1 = new fabric.Rect({
  width: 100,
  height: 100,
  fill: 'red',
  top: 50,
  left: 50
});

var rect2 = new fabric.Rect({
  width: 100,
  height: 100,
  fill: 'blue',
  top: 200,
  left: 150,
  excludeFromExport: true  // 设置该对象不被导出
});

var circle = new fabric.Circle({
  radius: 50,
  fill: 'green',
  top: 100,
  left: 300
});

canvas.add(rect1, rect2, circle);

// 导出图片
var canvasData = canvas.toDataURL({
  format: 'png',
  excludeClass: 'excludeFromExport'  // 排除带有 excludeFromExport 属性的对象
});

效果演示地址：https://jsfiddle.net/5wudkvoc/

总结

excludeFromExport 属性是 Fabric.js 中非常实用的一个功能，可以在导出图片或SVG时排除不需要导出的对象。在实际应用中，我们可以根据自己的需要灵活使用该属性，提高导出效率和质量。