如何在fabric.js中获取目标元素的属性值

时间:2016-02-14 14:15:49

标签: javascript canvas html5-canvas fabricjs

(function() {   
   var canvas = this.__canvas = new fabric.Canvas('c');  
   fabric.Object.prototype.transparentCorners = false;                 
   canvas.on({        
     'object:selected': function(e) {  
     e.target.opacity = 0.5;  
     //find which object is selected  
     console.log(e.target);  
     console.log(e.target.get('type'));  
     //How to get targeted element attribute value   
     //??????????????        
     },    
  'object:modified': function(e) {    
   e.target.opacity = 1;  
    }
 });
fabric.Image.fromURL('img/shoes-hills.png', function(oImg1) {  
 // scale image down, and flip it, before adding it onto canvas    
    oImg1.perPixelTargetFind = true;        
    canvas.add(oImg1);  
  });  
})();  

如何在fabric.js中获取目标元素的属性值。 这里我得到了目标元素的类型,但我希望该图像元素的属性值(图像源)用于识别在此画布中选择的图像元素。

2 个答案:

答案 0 :(得分:0)

以下是解决方案的小提琴:https://jsfiddle.net/jimedelstein/yb9yf0vr/

只需致电e.target.getSrc()

您可能希望先进行类型检查(并且您已经知道如何根据现有代码执行此操作。

希望这就是你要找的东西!

答案 1 :(得分:0)

你也可以试试这个:

 //instead of e.target you can get the selected object with findTarget()
 var targetObj= this.findTarget();

//now that we have the selected object you can get the src property of the _element property.


    console.log(targetObj._element.src);//1st way
    console.log(targetObj._element.currentSrc);//2nd way
    console.log(targetObj.getSrc());//3rd way

希望有所帮助,祝你好运。