2016-03-28 2 views
0

だから私は、私が使用してキャンバスにSVGグラフィックスを追加できることを推測しました:Fabric.jsのキャンバスからSVGを削除するにはどうすればよいですか?

fabric.loadSVGFromURL('img1.svg', function(objects, options) { 
    var obj1 = fabric.util.groupSVGElements(objects, options); 
    canvas.add(obj1); 
}); 

fabric.loadSVGFromURL('img2.svg', function(objects, options) { 
    var obj2 = fabric.util.groupSVGElements(objects, options); 
    canvas.add(obj2); 
}); 

は、私は今、一つまたはそれらの両方を削除するとします。どうやってやるの?

答えて

0

fabricjs私はキャンバス内のオブジェクトを削除するために別の方法を使用します。このメソッドは、キャンバス内のオブジェクトをすべて削除します。 fabricjsは、我々は(私はこのためのjQueryを使用:)

var canvas = new fabric.Canvas('c'); 
fabric.loadSVGFromURL('test.svg', function(objects, options) { 
    var obj2 = fabric.util.groupSVGElements(objects, options); 
    obj2.name ="test_svg" //<<<<<<< here set name 
    canvas.add(obj2); 
    console.log(canvas.getObjects()) 
}); 

function del(){ 
$.each(canvas._objects, function(index, obj) { 
    if(obj == null) return; 
    $.each(obj, function(attr, value) { 
      //console.log(attr + ' == ' + value); 
      if(value == "test_svg"){ //<<<<< here we call name 
        //alert(index); 
        canvas.remove(canvas._objects[index]); // here we delete that object 
        canvas.renderAll(); 
       } 
      }); 
}); 
} 

私は、負荷SVG方法からこれをテストし、そのworked.soは多分これはこのobject.like削除するには、このプロパティを使用できるように、各オブジェクトのnameを設定することができますあなたのために働いた..

関連する問題