自定义节点无法拖拽

问题描述，红色心node内部无法拖拽
尝试改变path的路径得到结果:灰色心node内部左半边可以拖拽，右半边无法拖拽；绿色心node内部都可以拖拽
诉求，想要解决红色心node的拖拽问题 或者 设置path的时候应该如何避免出现这样的情况
复现页面代码如下
```
<!Doctype html>
<html>
<head>
    <script src="https://gw.alipayobjects.com/os/lib/antv/g6/4.7.10/dist/g6.min.js"></script>
</head>
<body>
<div>
    <div id="map" ></div>
</div>
</body>
<script>
document.addEventListener("DOMContentLoaded",function (){
    load();
});
function load(){
    G6.registerNode('red-love',{
        draw(cfg, group) {
            let shape = group.addShape("path",{
                attrs: {
                    path:"m40.25,19.99739c16.28566,-47.25204 80.09339,0 0,60.75262c-80.09339,-60.75262 -16.28566,-108.00466 0,-60.75262z",
                    stroke:'black',
                    fill:'red',
                    lineWidth:1.5,
                },
                name: 'custom-node-path',
                draggable: true,
            });
            return shape;
        },
    });
    G6.registerNode("green-red-love",{
        draw(cfg, group) {
            return group.addShape("path",{
                attrs: {
                    path:"m40.25,79.99739c-80.09339,-60.75262 -16.28566,-108.00466 0,-60.75262c16.28566,-47.25204 80.09339,0 0,60.75262z",
                    stroke:'black',
                    fill:'gray',
                },
                name: 'custom-node-path',
                draggable: true,
            })
        }
    })
    G6.registerNode("green-love",{
        draw(cfg, group) {
            return group.addShape("path",{
                attrs: {
                    path:"m25.94425,72.30723c-18.51907,-18.87868 -25.14037,-30.821 -25.19403,-45.44056c-0.04894,-13.32752 8.12472,-26.19053 16.59528,-26.11635c4.22982,0.03712 13.30305,4.94237 16.51591,8.92911c1.61883,2.00875 2.38558,1.81067 5.98973,-1.54739c9.80897,-9.13919 19.38753,-9.33102 25.59103,-0.51247c9.91451,14.0939 8.10946,30.92458 -5.18889,48.38255c-7.07017,9.28167 -22.50987,25.74787 -24.14274,25.74787c-0.49686,0 -5.07169,-4.24925 -10.16629,-9.44277z",
                    stroke:'black',
                    fill:'green',
                },
                name: 'custom-node-path',
                draggable: true,
            })
        }
    })
    const graph = new G6.Graph({
        container: "map", // String | HTMLElement，必须，在 Step 1 中创建的容器 id 或容器本身
        width: 800, // Number，必须，图的宽度
        height: 500, // Number，必须，图的高度
        modes:{
            default:['drag-node']
        }
    });
    const data = {
        // 点集
        nodes: [
            {
                id: 'node1', // String，该节点存在则必须，节点的唯一标识
                x: 100, // Number，可选，节点位置的 x 值
                y: 200, // Number，可选，节点位置的 y 值
                type:'red-love'
            },
            {
                id: 'node2', // String，该节点存在则必须，节点的唯一标识
                x: 300, // Number，可选，节点位置的 x 值
                y: 200, // Number，可选，节点位置的 y 值
                type: 'green-red-love'
            },
            {
                id: 'node3', // String，该节点存在则必须，节点的唯一标识
                x: 500, // Number，可选，节点位置的 x 值
                y: 200, // Number，可选，节点位置的 y 值
                type: 'green-love'
            },
        ],

};
    graph.data(data); // 读取 Step 2 中的数据源到图上
    graph.render(); // 渲染图
}
</script>
</html>
```

GVP antv/G6

内容风险标识

评论 (1)

GVPantv/G6

内容风险标识