javascript - Rappid (JointJS?) 中的链接箭头设计

Question

我正在使用 Rappid 开发图表，我需要修改默认箭头，使其看起来像这张图片中的第一个和第三个（“一个”和“一个（并且只有一个）”）：

我能得到的最好的东西给了我这个：

要么是空白，要么是线条离结尾太近了……我承认我已经大量研究了 SVG d-paths，但我仍然几乎不理解它们。这是我正在使用的两个：

M56 0 L56 16 L54 16 L46 16 L46 0 L48 0 L48 16 L54 16 L54 0

M56 0 L56 16 L54 16 L24 16 L54 16 L54 0

Answer 1

链接箭头由 JointJS ( joint.dia.linkView) 自动翻译和自动定向。它确保线条始终在箭头边界处开始/结束，即您不能强制线条穿过箭头。

您可以通过将缺少的线段添加到箭头路径本身来欺骗这一点。

'M 0 -10 L0 10 M 0 0 L-10 0'

另一种选择是SVGMarker改用。请参阅JSFiddle演示，其中还包括 IE 错误的解决方法。