Fabric.js - Farbe/Füllung/Strich des importierten Svg ändern

Question

Gibt es eine Möglichkeit, die Farbe eines Svg in Stoff auf der Leinwand mit loadSVGFromURL zu ändern? Die SVG ist nur ein Pfeil, wenn ich die Füllung oder den Strich nicht einstellen kann, kann ich das mit einem Filter machen?

$("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(); 
    }); 
}); 

Die Funktion setFill auf fabric.PathGroup Objekte funktioniert nur, wenn alle Pfade die gleiche Farbe hat: https://github.com/kangax/fabric.js/blob/master/src/path_group.class.js#L99

Answer 2

können Sie OBJECT.setFill ('FILL_COLOR'); zum Beispiel

rect.setFill('red');