为每个对象JointJS创建一个ToolElement

Question

我正在尝试为每个对象创建一种工具菜单 - 当您单击或将鼠标悬停在某个元素上时，它会显示几个可以执行的操作：删除，旋转，放大，链接等。

我已使用此question作为指南 - 并且能够在JFiddle的帮助下添加和扩展ToolElement本身。

但是，之后我就陷入了链接的功能。我想做的是绿色箭头。当我单击并拖动绿色箭头时，我希望链接开​​始从对象开始拖动，就像端口一样，只能从对象本身拖动。

我尝试阅读文档，但它没有如何从元素中拖动的痕迹。

有一个解决方案，你可以在文本中添加magnet : true属性，当你点击对象时 - 你拖动它，当你点击文本时，你开始拖动链接。< / p>

在下面的另一个解决方案中，我尝试手动将磁铁添加到圆圈中。在视觉上，它有点做我需要的，但链接的源始终是绿色圆圈，即使它消失，并且当调用对象ti检查链接时，它不会给我这些链接。

joint.shapes.tm.toolElement = joint.shapes.basic.Generic.extend({

    toolMarkup: ['<g class="element-tools">',
        '<g class="element-tool-remove"><circle fill="red" r="11"/>',
        '<path transform="scale(.8) translate(-16, -16)" d="M24.778,21.419 19.276,15.917 24.777,10.415 21.949,7.585 16.447,13.087 10.945,7.585 8.117,10.415 13.618,15.917 8.116,21.419 10.946,24.248 16.447,18.746 21.948,24.248z"/>',
        '<title>Remove this element from the model</title>',
        '</g>',

        '<g class="element-tool-link"><circle magnet="true" fill="green" r="11" cx="25" />',
        '<path transform="scale(.8) translate(15, -16)" d="M24.778,21.419 19.276,15.917 24.777,10.415 21.949,7.585 16.447,13.087 10.945,7.585 8.117,10.415 13.618,15.917 8.116,21.419 10.946,24.248 16.447,18.746 21.948,24.248z"/>',
        '<title>Link element</title>',
        '</g>',

        '</g>'].join(''),

   defaults: ...

});

我认为我的底线问题是弄清楚如何在绿色箭头上使用磁铁属性并将其绑定到物体上。

任何帮助都将不胜感激。