Html Highcharts网络图箭头链接

我正在尝试使用Highcharts创建网络图，如下所示：

但是，在Highcharts网络图模块中，我没有看到任何添加箭头而不是连接节点的线段的选项。是否可以使用Highcharts进行此操作？如果没有，这个用例有更好的替代方案吗？下面是我当前必须渲染网络图的代码

    eventWorkflowGraph = Highcharts.chart('graph-canvas', {
    chart: {
        type: 'networkgraph',
        spacingBottom: 15,
        spacingTop: 15,
        spacingLeft: 15,
        spacingRight: 15,
    },
    title: {
        text: 'Workflow'
    },
    subtitle: {
        text: 'Network Graph'
    },
    plotOptions: {
        networkgraph: {
            keys: ['from', 'to'],
            layoutAlgorithm: {
                friction: -0.9,
                linkLength: 100,
                enableSimulation: true
            },
            link: {
                width: 4
            }
        }
    },
    series: [{
        dataLabels: {
            enabled: true,
            linkFormat: '',
        },
        marker: {
            radius: 45
        },
        data: edges
    }]
});

这将按如下方式呈现网络图：

---

根据评论-以下是如何呈现networkgraph系列中链接末尾箭头的答案

演示：

（功能（H）{
H.wrap（H.seriesTypes.networkgraph.prototype.pointClass.prototype，'getLinkPath'，函数（p）{
var left=this.toNode，
右=this.fromNode；
变量角度=Math.atan（（left.plotX-right.plotX）/
（left.plotY-right.plotY））；
如果（角度）{
设路径=['M'，left.plotX，left.plotY，right.plotX，right.plotY]，
最后一点=左，
nextLastPoint=右，
点半径=45，
箭头长度=20，
箭头宽度=10；
if（left.plotY

我在代码方面取得了一些进展-请看一看：对于这个演示，我也设法做到了，包括radius值：不幸的是，当前的networkgraph实现没有提供节点之间的双链接。您可以在Highcharts用户语音频道：或Highcharts GitHub问题频道上报告此想法：我发布了答案，可能对其他将面临相同问题的用户有用。谢谢

(function(H) {
  H.wrap(H.seriesTypes.networkgraph.prototype.pointClass.prototype, 'getLinkPath', function(p) {
    var left = this.toNode,
      right = this.fromNode;

    var angle = Math.atan((left.plotX - right.plotX) /
      (left.plotY - right.plotY));


    if (angle) {
      let path = ['M', left.plotX, left.plotY, right.plotX, right.plotY],
        lastPoint = left,
        nextLastPoint = right,
        pointRadius = 45,
        arrowLength = 20,
        arrowWidth = 10;

      if (left.plotY < right.plotY) {
        path.push(
          nextLastPoint.plotX - pointRadius * Math.sin(angle),
          nextLastPoint.plotY - pointRadius * Math.cos(angle),
        );
        path.push(
          nextLastPoint.plotX - pointRadius * Math.sin(angle) - arrowLength * Math.sin(angle) - arrowWidth * Math.cos(angle),
          nextLastPoint.plotY - pointRadius * Math.cos(angle) - arrowLength * Math.cos(angle) + arrowWidth * Math.sin(angle),
        );

        path.push(
          nextLastPoint.plotX - pointRadius * Math.sin(angle),
          nextLastPoint.plotY - pointRadius * Math.cos(angle),
        );
        path.push(
          nextLastPoint.plotX - pointRadius * Math.sin(angle) - arrowLength * Math.sin(angle) + arrowWidth * Math.cos(angle),
          nextLastPoint.plotY - pointRadius * Math.cos(angle) - arrowLength * Math.cos(angle) - arrowWidth * Math.sin(angle),
        );


      } else {
        path.push(
          nextLastPoint.plotX + pointRadius * Math.sin(angle),
          nextLastPoint.plotY + pointRadius * Math.cos(angle),
        );
        path.push(
          nextLastPoint.plotX + pointRadius * Math.sin(angle) + arrowLength * Math.sin(angle) - arrowWidth * Math.cos(angle),
          nextLastPoint.plotY + pointRadius * Math.cos(angle) + arrowLength * Math.cos(angle) + arrowWidth * Math.sin(angle),
        );
        path.push(
          nextLastPoint.plotX + pointRadius * Math.sin(angle),
          nextLastPoint.plotY + pointRadius * Math.cos(angle),
        );
        path.push(
          nextLastPoint.plotX + pointRadius * Math.sin(angle) + arrowLength * Math.sin(angle) + arrowWidth * Math.cos(angle),
          nextLastPoint.plotY + pointRadius * Math.cos(angle) + arrowLength * Math.cos(angle) - arrowWidth * Math.sin(angle),
        );

      }

      return path
    }
    return [
      ['M', left.plotX || 0, left.plotY || 0],
      ['L', right.plotX || 0, right.plotY || 0],
    ];
  });
}(Highcharts));