I'm trying to build a web application to visualize a GPS track (polyline on a base map) together with other information (e.g. speed) which is on the same time base as the lat/lng coordinates. In another word the data columns are typically:
[timestamps, latitude, longitude, speed].
Using these data columns as an example, on the page I'd like to have two subplots: a line module to show
timestamp and a map module to show the track - a polyline of
(latitude, longitude) points.
For the interactive part, when the mouse is hovering over the line chart, a highlighted point should appear at the corresponding point on the track in the map chart. Vice versa, when the mouse is hovering over the map chart, a highlighted point should appear in the line chart, showing the speed value of that particular point.
I've looked at the examples from plotly.js and d3.js (which plotly is based upon) and didn't find any existing example that matches my expectations very well. Somehow I feel they may be the right choice but I'd then need some advice/guidance about which modules in the libraries is relevant to my use case so that I don't have to learn everything.
If there're other choices I'd like to hear too.
Some other requirements:
- License - the library should be free for commercial use
- Performance - the library should be able to handle typically tens of thousands to hundreds of thousands rows of data points
- Documentation - preferably the library is still under active development and has good documentation resources