javascript - 修复 IE11 中 DagreD3 边缘箭头填充

Question

DagreD3提供了出色的图形网络布局，并集成到 D3 以进行显示，但边缘箭头在旧 Web 浏览器（例如 IE11）中无法正确显示。箭头标记在 IE11 中显示，没有填充颜色。

使用 IE11 查看DagreD3 样式演示时可以看到这一点。缺少填充的箭头以红色圈出。

标签： javascriptd3.jsdagre-d3

Answer 1

解决此问题的一种快速方法是添加向svg.marker元素添加填充颜色的 CSS。DagreD3svg.marker为每条边添加一个，并为边箭头使用元素 ID 命名方案，如#arrowhead123. 要使用一个 CSS 选择修改所有箭头，请添加：

[id^=arrowhead] {
  fill: black;  /* fills edge arrowheads in IE11 */
}