Fabric.js - изменение цвета/заливка/ход импортированного svg

Question

Есть ли способ изменить цвет svg в ткани, размещенной на холсте, используя loadSVGFromURL? Svg - это просто стрелка, если я не могу установить заливку или удар, могу ли я сделать это с помощью фильтра?

$("input:radio[id='arrow']").click(function() { 
fabric.loadSVGFromURL('../scripts/svg/arrow.svg', function(objects) { 
      var group = new fabric.PathGroup(objects, { 
      left: 165, 
      top: 100, 
      width: 295, 
      height: 40, 
      fill: colourSet 
     }); 
     canvas.add(group); 
     canvas.renderAll(); 
      }); 
      }); 

Answer 1

var colorSet = '#00FFFF'; 

$("input:radio[id='arrow']").click(function() { 
    fabric.loadSVGFromURL('../scripts/svg/arrow.svg', function(objects, options) { 
    var shape = fabric.util.groupSVGElements(objects, options); 
    shape.set({ 
     left: 165, 
     top: 100, 
     width: 295, 
     height: 40 
    }); 
    if (shape.isSameColor && shape.isSameColor() || !shape.paths) { 
     shape.setFill(colorSet); 
    } 
    else if (shape.paths) { 
     for (var i = 0; i < shape.paths.length; i++) { 
     shape.paths[i].setFill(colorSet); 
     } 
    } 
    canvas.add(shape); 
    canvas.renderAll(); 
    }); 
}); 

Функция setFill на fabric.PathGroup объектов работает только тогда, когда все пути имеет тот же цвет: https://github.com/kangax/fabric.js/blob/master/src/path_group.class.js#L99

Answer 2

вы можете использовать OBJECT.setFill ('FILL_COLOR'); , например

rect.setFill('red');