简体   繁体   中英

Force-directed graph in Highcharts has lost its lines

First of all, here's the standard JSFiddle for a Force-Directed Graph .

Here's the JSFiddle for my (perhaps misuse of) Force-Directed Graph .

My JSFiddle is throwing a larger-than-usual lump of data at Highcharts (scroll right to the bottom of the JS panel to see actual code) which may be the reason why I'm having the problem that I am having, namely that the lines joining the nodes are missing.

Other non-standard things are happening, eg

    series: [{
        dataLabels: {
          enabled: true
        },
        data: Data.DAT,
        formatting: Data.FMT
      }
    ]

The formatting tag is permitted (according to Highcharts themselves) as it doesn't clash with anything in Highcharts API. In subsequent iterations of the main code base, I put everything into data and refer to DAT and FMT deeper in.

It is possible that something in the node management is amiss

e.options.data.forEach(function (link, i) {

if (!e.options.formatting[link.from]) {
  console.log("No formatting given for FROM %s", link.from);
} else {
  nodes[link.from] = {
    id: link.from,
    marker: {
      radius: e.options.formatting[link.from].size
    },
    plotX: e.options.formatting[link.from].x,
    plotY: e.options.formatting[link.from].y,
    fixedPosition: true,
    name: e.options.formatting[link.from].name,
    color: e.options.formatting[link.from].colour
  };
}

if (!e.options.formatting[link.to]) {
  console.log("No formatting given for TO %s", link.to);
} else {
  nodes[link.to] = {
    id: link.to,
    marker: {
      radius: e.options.formatting[link.to].size
    },
    plotX: e.options.formatting[link.to].x,
    plotY: e.options.formatting[link.to].y,
    fixedPosition: true,
    name: e.options.formatting[link.to].name,
    color: e.options.formatting[link.to].colour
  };
}
});

However, I'm at a loss trying to work out how to gets the lines to reappear, thus this posting.

The reason your lines disappear is because you are above turboThreshold . You can see this by looking at console which gives the following error:

Highcharts error #12: www.highcharts.com/errors/12

The fix for this, is either to comply with turbo threshold, that is format your series as an array (which could improve performance). Or to increase the turbo threshold. The latter will make it work, but performance will not be great.

Working example: https://jsfiddle.net/ewolden/3qLdmut8/

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM