CODEWITHSUNDEEP
highcharts
Darcy Dyll
Darcy Dyll

Reputation: 51

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?

Upvotes: 5

Views: 4708

Answers (4)

Eli
Eli

Reputation: 335

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

Upvotes: 0

Miles Yucht
Miles Yucht

Reputation: 564

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.

Upvotes: 1

Sebastian Bochan
Sebastian Bochan

Reputation: 37578

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

Upvotes: 3

SteveP
SteveP

Reputation: 19093

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).

Upvotes: 0

Related Questions