Code Sample : Merging Links between same nodes in Network Graph
HTML
<html>
<head>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/networkgraph.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
</head>
<body>
<figure class="highcharts-figure">
<div id="graph-container"></div>
</figure>
</body>
</html>
CSS
*{
background: #222;
color: white;
font-family: Verdana, sans-serif;
font-weight: bold;
}
.highcharts-figure{
left: 0;
min-height: 50%;
max-height: 50%;
}
JavaScript
var hash=new Map();
//WRAPER CODE FOR ARROWS//
//This wrapper code draws an arrow on HighCharts graph edges.
//It is adapted from https://jsfiddle.net/BlackLabel/cnjw7v2s/
//All credit goes to them.
(function(H) {
H.wrap(H.seriesTypes.networkgraph.prototype.pointClass.prototype, 'getLinkPath', function(p) {
var left = this.fromNode,
right = this.toNode;
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 = 10,
arrowLength = 15,
arrowWidth = 6;
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...