I wanted to generate a chart with billions of data points. I can’t apply aggrigation or segmentation-based techniques to reduce the number of data points, as all of them are equally important. Rendering charts client-side (in the browser) with these many datapoints is causing crashes. So I was looking for something that would do compute-heavy things like rendering on the server side, but at the same time, there should be interaction support in the charts. Interaction in terms of zooming in, seeing a tooltip on hover, showing hide on legends, clicking, and all.
I don’t want to go with SVG-based charts, as those will create billions of elements in the browser and crash again.
I tried implementing it with eCharts, but it’s not exposing an image map, so i’m not able to add interaction layer.
2
Answers
You could, you basically just need to have your front end request a new chart render if the user interacts with it, like when zooming in.
For the tooltip on hover, this will be hard to do because you’ll need the billions points in this case. Some PHP charting library provide a way to generate the image map for the graph, this would allow you to figure important regions on the image.
All in all, you won’t be able to do what you are asking easily. But it is entirely do-able, you just need to code the front-end interactions yourself
You can try ChartDirector. It is a server side commercial charting library and is advertised to support a billion data points.
No matter how many data points you have, the visible data points are limited by the number of pixels on the image. ChartDirector works by throwing away invisible points. Zooming and scrolling requires a round trip to the server. If it is line or area chart, there is an efficient "track cursor" method to display the data when hovering even with large number of points. Otherwise it has to use the image map which will become very large for large number of points (even after throwing away the invisible points).