D3力导向图中的箭头

Question

我感到很困惑，为什么仅仅复制并粘贴示例http://bl.ocks.org/1153292 箭头不对齐。（如下图所示）。

更新：在chrome和safari中可以工作，但在Firefox中无法正常工作...更加困惑了。有什么想法吗？

您会怎样更改示例代码，以获取直线而不是曲线？

谢谢。

- Gian

---

报告Firefox上的错误：http://bugs.mozilla.org - Erik Dahlström

报告如下：建议的面包编号为773266。 - Gian

还向d3报告了此问题：https://github.com/mbostock/d3/issues/704 - Erik Dahlström

D3 bug 被关闭，原因是浏览器问题。 - Spaceghost

Answer 1

在Chrome和Safari中运行正常，在Firefox 14及更早版本中出现问题。 在Firefox 15及以后的版本中已经修复。 请参见错误：https://bugzilla.mozilla.org/show_bug.cgi?id=773266

我在Firefox 14（失败）和15（通过）上进行了测试。

对于最初的问题，答案是： 因为它在Firefox中无法正常工作。

- Spaceghost

Answer 2

我也遇到过这个问题。但是我通过以下方式解决了它。打开Firebug，进入svg > defs > marker部分。然后更改refX和refY的值。这对我有效。

- sbillah

---

你是指以下内容吗？<defs> <marker id="suit" viewBox="0 -5 10 10" refX="15" refY="-1.5" markerWidth="6" markerHeight="6" orient="auto"> <marker id="licensing" viewBox="0 -5 10 10" refX="15" refY="-1.5" markerWidth="6" markerHeight="6" orient="auto"> <marker id="resolved" viewBox="0 -5 10 10" refX="15" refY="-1.5" markerWidth="6" markerHeight="6" orient="auto"> 要将它们更改为什么？你不能通过编程实现吗？ - Gian

尝试更改refX和/或refY的值，您将立即注意到箭头标记移动。 - sbillah

你的意思是我必须通过试错来解决吗？还是在代码中检测浏览器时可以编程添加固定的Firefox调整？ - Gian

Answer 3

可能是复制粘贴错误吗？这里可以正常工作。http://jsbin.com/akulid/edit#html,live

- Damen TheSifter

---

谢谢 Damen。唯一的区别是我只包括新的 d3.v2.js，而不是 <script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.29.1"></script>、<script type="text/javascript" src="http://mbostock.github.com/d3/d3.geom.js?1.29.1"></script> 和 <script type="text/javascript" src="http://mbostock.github.com/d3/d3.layout.js?1.29.1"></script>。这些文件是否已经包含在新的 d3.v2.js 中？我试着添加它们，但 Firefox 告诉我找不到它们。你能否建议一些更改使箭头变直？谢谢。 - Gian

我在使用D3.js的1.29和v2版本时发现了相同的行为（箭头在FF中方向错误，但在Chrome或Safari等基于Webkit的浏览器中没有问题）。 - Spaceghost