zrender 绘制 Path 时如何解决事件监听范围过大的问题？

一分耕耘，一分收获！既然打开了这篇文章《zrender 绘制 Path 时如何解决事件监听范围过大的问题？ 》，就坚持看下去吧！文中内容包含等等知识点...希望你能在阅读本文后，能真真实实学到知识或者帮你解决心中的疑惑，也欢迎大佬或者新人朋友们多留言评论，多给建议！谢谢！

zrender 绘制 Path 事件监听范围过大

问题描述：

绘制一个爱心 path 时，点击事件监听范围超出图形区域，导致不在图形内部点击也会触发事件。已知问题原因是生成的默认 rect 过大，但 Github 上给出的解决方案并未解决此问题。

解决方法：

修改代码，将事件类型更改为拖动，并移除 cursor 样式：

var path = new zrender.path.createFromString(`M 10,30 A 20, 20 0, 0, 1 50, 30 A 20, 20 0, 0, 1 90, 30Q 90, 60 50, 90Q 10, 60 10, 30 z`,
{
    draggable: true,  // 修改事件类型为拖动
    style: {
        fill: 'red',
        stroke: 'blue'
    },
    ondrag: function () {
        console.log('click');
    }
}
)

通过修改事件类型和移除 cursor 样式，事件监听范围将局限在 path 形状区域内，解决超出监听的问题。

以上就是《zrender 绘制 Path 时如何解决事件监听范围过大的问题？ 》的详细内容，更多关于的资料请关注golang学习网公众号！