如何以编程方式触发fabric.js“ object:modified”事件?

食人魔

我想以编程方式触发“ object:modified”事件。我已经尝试过“开火”和“触发”方法。

var canvas = new fabric.Canvas('c');

canvas.on("object:modified", function (e) {
    alert("object modified");
});

var text = new fabric.Text('Text', {
  fontFamily: 'Hoefler Text',
  left: 10,
  top: 10
});

canvas.add(text);

$('.fillText').click(function(){
  text.setFill($(this).data('color'));
  canvas.renderAll();

  text.trigger('modified');
});

$('#moveText').click(function(){
  text.setLeft(50);
  text.setTop(50);
  text.setCoords();
  canvas.renderAll();

  text.trigger('modified');
});

https://jsfiddle.net/gb4u85q4/

莱罗耶德夫

您可以使用触发事件canvas.trigger('<eventname>', options);fire已弃用,因此您应该避免使用它。

由于您想触发object:modified,因此可以通过以下方式进行操作,同时传递已修改的对象:

canvas.trigger('object:modified', {target: text});

用添加的解决方案更新了您的JSFiddle:)(注意,我改变了alert一个console.log,因为我发现恼人的警报,您可以查看输出console.log的开发工具,它可以通过按下F12打开例如谷歌浏览器)

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何以编程方式触发聚焦事件

如何以编程方式选择Fabric.js对象

如何以编程方式触发使用addEventListener定义的dblclick事件?

Fabric.js-将object:modified事件同步到另一个客户端

如何使用d3.js以编程方式触发拖动事件?

如何以编程方式触发Vuetify.js组件上的涟漪效应?

如何以编程方式创建事件触发器以进行控制

单元测试FileSystemWatcher:如何以编程方式触发更改的事件?

如何以编程方式在输入文本字段上触发输入事件?

Ckeditor 5如何以编程方式触发复制,剪切,粘贴事件

如何以编程方式引发SizeChanged事件

如何以编程方式替换@click事件?

如何以编程方式生成按键事件

Fabric Js:如何以编程方式创建矩形,只有左上角和右下角的 2 个点?

您如何以编程方式在有角度的应用程序中的选择字段上触发点击事件?

如何以编程方式向 devExtreme 列表搜索框输入值并触发将照常过滤列表的事件?

如何以编程方式创建Vue.js插槽?

如何以编程方式调用 JS setter 函数

如何以编程方式关闭notify.js通知?

如何以编程方式处理英语收缩[Regex,JS,Ruby]

如何以编程方式设置在角度js中选择?

如何以编程方式制作可迭代的 js 承诺?

如何收听在Vue JS中以编程方式创建的子事件?

Azure:如何以编程方式创建事件订阅

如何以编程方式调用 TextBox 的 Click 事件处理程序

如何以编程方式调用 DialogPage 取消按钮事件

如何以编程方式查看登录事件?

如何以编程方式调用Kendo Ui Scheduler的Navigation事件

如何以编程方式在Android上发出Click事件