Javascript 将ID添加到Fabric.js元素
我正在使用Fabric.js库在画布中创建一个“类似地图”的应用程序。我基本上是把一张图片放下来,然后在图片的上面用正确的坐标画圆圈。点的位置和名称作为从ajax调用接收到的JSON数据显示出来。我需要一种方法来引用任何一个圆圈,这样我就可以获取关于该圆圈的更多信息(每个圆圈都有一个包含更多详细信息的弹出窗口) 我在文档中找不到解释如何执行此操作的任何地方,我已尝试向如下对象添加ID:Javascript 将ID添加到Fabric.js元素,javascript,html,canvas,html5-canvas,fabricjs,Javascript,Html,Canvas,Html5 Canvas,Fabricjs,我正在使用Fabric.js库在画布中创建一个“类似地图”的应用程序。我基本上是把一张图片放下来,然后在图片的上面用正确的坐标画圆圈。点的位置和名称作为从ajax调用接收到的JSON数据显示出来。我需要一种方法来引用任何一个圆圈,这样我就可以获取关于该圆圈的更多信息(每个圆圈都有一个包含更多详细信息的弹出窗口) 我在文档中找不到解释如何执行此操作的任何地方,我已尝试向如下对象添加ID: tokens.add(newfabric.Circle({半径:25,填充:'#f55',顶部:100,左侧:
tokens.add(newfabric.Circle({半径:25,填充:'#f55',顶部:100,左侧:70,id:“foo”}))代码>
没有运气找回它。任何帮助都将不胜感激。这也是我第一次与这个社区互动,如果我的问题不够详细,或者存在其他问题,我深表歉意。您可以使用fabric.object.prototype添加属性。
因此,添加:
fabric.Object.prototype.uid = ... ;
您可以扩展fabric.Object类并添加自己的属性,但最简单的方法是使用fabric.util.Object.Extend()
。
您可以添加任意数量的自定义属性,并使用object.toObject().id
访问它
extend(object, prop) {
object.toObject = ((toObject) => {
return function () {
return fabric.util.object.extend(toObject.call(this), prop);
};
})(object.toObject);
}
然后
this.extend(line , {
customType:'ArrowLine',
id:this.randomId(),
CommentId:activeObject.toObject().id, extensionId
});
我在这里回答了一个类似的问题-我能够让它工作,谢谢。请检查以下内容: