cursor hover with shared X: per-series nearest Y using cursor.dataIdx

[JaeanHan]

Hi, and thanks for uPlot. I’m using it a lot and really appreciate its speed and small footprint.

I’m using uPlot in a case where multiple series share the same X values. With the current cursor behavior, when several points share the same X, the cursor snaps to the nearest X index as expected, but for each series the highlighted point at that X seems fixed: moving the mouse up and down over vertically stacked points does not change which point is highlighted.

For my use case it would be useful to have an optional behavior where:

• uPlot still finds the nearest X index as it does now, and
• for each visible series, among all points that share that X value, the point whose rendered Y (valToPos(y, scale)) is closest to the cursor’s Y position is selected.

In short: “closest X, then per-series closest Y” when multiple points share the same X value.

I put together a small repro and an experimental cursor.dataIdx override here (two charts: default behavior vs. overridden behavior):

• https://jsfiddle.net/w6jebom0/13/

Questions:

• Is the current behavior for shared X values (sticking to a single index per series at that X, regardless of cursor Y) intentional?
• I’m wondering whether a “closest X, then per-series closest Y” hover mode might be something you’d consider supporting as an optional behavior in uPlot, or at least mentioning as a recommended pattern for shared-X use cases like this.

I’m mainly sharing this use case and the workaround in case it’s useful to you or other users. If this feels out of scope for core, I’m also totally fine keeping it as a user-level pattern like in the JSFiddle.

[leeoniya]

hey, im not by a computer at the moment to look at your code (will look tomorrow), but maybe check out the 50-series demo here:

https://leeoniya.github.io/uPlot/bench/uPlot-10M.html

there is an option cursor.points.one: true that's mainly there for performance (to avoid rendering and updating 50+ hover points on each hover change). it pretty much does what you're describing, i think.

[JaeanHan]

Thanks for the pointer! I tried cursor.points.one: true and it definitely helps with performance and reduces the number of hover markers.

In my case though, the main issue is a bit different: in this chart a single series can have multiple points with the same X (a vertical-line-style series). When the cursor snaps to that X, uPlot seems to pick a single fixed index per series at that X, and moving the cursor up/down doesn’t change which one is considered “hovered”.

What I’m trying to achieve is:
– still snap to the nearest X index as it does now, but
– for each visible series, when there are multiple points at that X, pick the point whose rendered Y (valToPos(y, scale)) is closest to the cursor’s Y.

The second chart in the JSFiddle shows an experimental cursor.dataIdx override that does this per-series selection.

No rush on checking the fiddle – my current workaround works fine. I’ve also attached screenshots of vertival-line series in case that helps.