Highcharts scatter plot with lots of data points running really slow

问题

I've seen a few suggestions here, but nothing seems to apply to my situation. I've also seen some unresolved similar issues. I have scatter plot with a lot of data (about 40k) points. It's really slow. The link below (genetic data - called a Manhattan plot) will eventually load, but it's just slow. I need to find a way to optimize performance.

http://ricediversity.org/test/highcharts/examples/line-ajax/index-b.htm

Also, I'm trying to add additional info (data fields) to my tooltip from my data file, but I can't get that working either. Any suggestions?

回答1:

You can try to disable animations / shadows.

http://api.highcharts.com/highcharts#chart.animation http://api.highcharts.com/highcharts#plotOptions.series.animation http://api.highcharts.com/highcharts#tooltip.animation http://api.highcharts.com/highcharts#plotOptions.series.shadow

回答2:

As far as tooltips, check out the highcharts data api, specifically number 2 in the list. If that doesn't cut it for you, you can pass in an array of objects where you specify the data you want to get. Then, in the formatter, it is easy to reference. Here's a JSfiddle showing how to reference the names once they're in your data array.

The formatter is

formatter: function () {
    var s = "";
    $.each(this.points, function (i, point) {
        s += point.point.nameList[0];
    });
    return s;
}

and the data sets look like:

data = [ ..., 
         {x: xval, y: yval, nameList: myListOfNames},
         ...]

where xval and yval are the x and y values of the data points and myListOfNames is an array of strings.

回答3:

There are some hints on optimising performance on the highcharts website here: http://docs.highcharts.com/#faq$optimize-performance

However, with that many points, I would consider using highstock. There is no way to make out the detail of that many points, so aggregating them in some way would make a better chart (http://docs.highcharts.com/#data-grouping).

回答4:

Perhaps too late to be useful (and the example link no longer works, so I'm not sure if this applies), but there's a newish Highcharts plugin to downsample time series data with the intent to retain the shape of the original data.

http://www.highcharts.com/plugin-registry/single/13/Highcharts-Downsample

来源：https://stackoverflow.com/questions/15750515/highcharts-scatter-plot-with-lots-of-data-points-running-really-slow

标签

Highcharts