Question

我使用loadSVGfromURL在画布中导入SVG。我想使用颜色选择器更改SVG中路径的颜色。

到目前为止，我提出了这个问题：

fabric.loadSVGFromURL(site_url,(objects,options) => {

  objects.find(i => i.id === 'colored1').set({fill: color)}`})
  const loadedObjects = fabric.util.groupSVGElements(objects, options)
  loadedObjects.scaleToWidth(this.canvas.getWidth())
  this.canvas.add(loadedObjects)
  this.canvas.renderAll();

});

问题是，这迫使我重新加载SVG的所有元素。有没有办法在使用groupSVGelements后编辑我的一个objets属性？

Answer 1

是，使用第三个参数reviveropt来更新特定对象的属性

fabric.loadSVGFromURL(site_url, (objects, options) => {
  const loadedObjects = fabric.util.groupSVGElements(objects, options)
  loadedObjects.scaleToWidth(this.canvas.getWidth())
  this.canvas.add(loadedObjects)
  this.canvas.renderAll();
}, function(object) {
  if (object.id === "colored1") {
    object.set({
      fill: color
    });
  }
});

Fabricjs - 编辑组的元素

1 个答案: