How to get the (x,y) value of each point

danchitnis / webgl-plot

A high-Performance real-time 2D plotting library based on native WebGL

https://danchitnis.github.io/webgl-plot-examples/vanilla/

MIT License

556 stars 33 forks source link

How to get the (x,y) value of each point #63

Open zhouyangit opened 3 years ago

zhouyangit commented 3 years ago

hi~， How to get the (x,y) value of each point，When the mouse moves over the line .

Thanks!

danchitnis commented 3 years ago

This should do the job? https://danchitnis.github.io/webgl-plot-examples/vanilla/cross.html

zhouyangit commented 3 years ago

ok! Thanks!

ilbertt commented 2 years ago

Would it be possible to show points when the mouse moves over the line? The cross example only prints the relative mouse position. Just like in this GIF: points on mouse over

Also it would be nice if there would be the possibility to always show the points on the line independently from the mouse, as again it is in the GIF above.

danchitnis commented 2 years ago

@Luca8991 Thanks for your suggestion. Yes, it is possible, but perhaps not as sleek as your attached image. I can make a basic WebGL tooltip to display the (x,y) when the mouse is over the line. In order for the tooltip to snap to the data points rather than following the plotted line, I need to think a bit more. Notice on dense data sets the individual data points are not visible.

ilbertt commented 2 years ago

@danchitnis let me know if you need some help (even though I don't have much experience with WebGL). I find your library very helpful and would be happy if it can improveto become a more complete plot library. For this reason, I think also the grid & axis would be something that would be nice if implemented and made available through the API.

danchitnis commented 2 years ago

I will create a separate folder webgl-plot/utils in which I put all the utility tools and separate them from the core. There are two immediate improvements on the axis:

The axis example needs improvement, especially on the ticks, sub-ticks, and the dynamic display of them when the graph is moving
Need to implement Cursors (or *Markers), locked in the x-axis or y-axis and draggable by mouse. This is similar to your attached gif and is often used in test and measurement equipment.

I would like to also - at some point - embed this in Jupyter notebooks. I would put a call out for that on the main Readme.