Question

我想在jsPlumb中添加一个很棒的箭头。

这就是我想要的：

这就是我得到的：

如何更改设置？

这是我目前使用的内容：

PaintStyle: { stroke: "#f00", strokeWidth: 20 },
connector: ["Straight"],
connectorOverlays:[["Arrow", { location:1, width:70, length:70 } ]]

之前我一直在使用SVG中的箭头。在那里，我可以简单地改变头部的SVG代码向前移动，使得线的末端（线端点的坐标）在箭头三角形内。我似乎无法在jsPlumb中执行此操作。

我认为很难传达这个问题。

这是下一次尝试：

Answer 1

将位置设置为0.99实际上对我有用。试试这个：

PaintStyle: { stroke: "#f00", strokeWidth: 20 },
connector: ["Straight"],
connectorOverlays:[["Arrow", { location:0.99, width:70, length:70 } ]]

Answer 2

这可能有用。请试一试

connector: ["StateMachine", {curviness:0.001}],
connectorOverlays:[
  [
    "Arrow", 
    { location: [0.5, 0.5], width: 70, length: 70 } 
  ]
]

中的叠加位置部分

Answer 3

到目前为止我还没有解决方案，我想通过查看github，它仍然是open issue。问题已在 2014 中打开。

一种解决方案是黑客库本身，以向Arrow对象添加边距或填充属性。

更新

我试图弄清楚图书馆本身。请参见下面的图像，它在那里进行一些数学计算。如果你擅长它，那就调整它，你就完成了！

而且extents是这里的用户：

UPDATE2：

尝试如下的位置数组:(演示：http://jsfiddle.net/crerhawn/）

["Arrow", { location:[0.5,0.5], width:70, length:70 } ]