在 d3-org-chart 中，我如何为边添加箭头

Question

在 d3 组织结构图中，我需要向孩子显示箭头边缘，我如何才能做到这一点。我尝试使用连接，但这些边缘无法通过链接正确到达。

我尝试在

linkupdate

中添加 marker-end ， marker-start 但它没有用。

linkUpdate(function (this,d, i, arr) {
  d34.select(this)
    .attr('stroke', (d) =>
      d.data._upToTheRootHighlighted ? '#152785' : 'black'
    )
    .attr('stroke-width', (d) =>
      d.data._upToTheRootHighlighted ? 5 : 1
    )
    .attr('pointer-events', 'none')
    .attr('stroke-linecap', 'round')
    .attr("marker-start", d => `url(#${d.from + "_" + d.to})`)
    .attr("marker-end", d => `url(#arrow-${d.from + "_" + d.to})`)
    
  if (d.data._upToTheRootHighlighted) {
    d34.select(this).raise();
  }
})

预期结果为（）

Answer 1

以下是我们如何使用 Org Chart JS 执行此操作： https://code.balkan.app/org-chart-js/arrows#JS