取消选择Fabric.js中的选定对象

Deselect a selected object in Fabric.js

本文关键字：对象 选择 Fabric js 取消      更新时间：2024-01-23

我的画布上有多个类型对象。我可以对特定对象执行缩放、旋转等操作。

但当我选择一个特定的对象时，我想更改它的stroke颜色。

canvas.observe('mouse:down', function(e) {
    activeInstance = canvas.getActiveObject();
    activeGroupInstance = canvas.getActiveGroup();
    if (activeInstance!=null){        
        activeInstance.set("stroke","#FF0000");
    }
}

代码运行良好。但问题是stroke颜色或任何其他有效的property都不能直接反映，这意味着我必须取消选择当前选择的对象才能查看其属性的变化。所以我的问题是出了什么问题？如果这是我们必须取消选择/单击所选对象的常见行为，那么，如何使用代码取消选择所选对象，即不使用鼠标单击，只需使用代码片段。

我们可以使用下面提到的解决方案。

要放弃所有活动组，您可以使用以下功能。丢弃当前活动的组和激发事件如果结构由于鼠标事件而调用该函数，则该事件将作为参数传递并发送给自定义事件的激发函数。当用作方法时，e参数没有任何应用程序。

canvas.discardActiveGroup();

要丢弃sigle对象，可以这样使用。丢弃当前活动的对象和火灾事件。如果结构由于鼠标事件而调用该函数，则该事件将作为参数传递，并发送给自定义事件的fire函数。当用作方法时，e参数没有任何应用程序。

canvas.discardActiveObject();

最后，我像这样渲染了顶部画布和次要容器画布。

canvas.renderAll();
相关文章：