Black Lives Matter. Please consider donating to Black Girls Code today.

Unable to display the measurement points when the 2 traces coincide with {hovermode:'closest'}

Codepen link - https://codepen.io/anon/pen/ddOawX

Problem 1- I’m not able to show the measurement point when 2 traces are coinciding in hovermode:‘closest’.

Problem 2- Whenever i zoom the span i also get the measurement points of the traces which are not even in the active span {hovermode:‘x’}.

The above 2 problems are inter-dependent. If i use closest then problem 2 is solved and if i use x then problem 1 is solved.
So,please help in in solving both the problems simultaneously.

About #1, this is a known problem, that unfortunately doesn’t have an easy solution. You can subscribe to https://github.com/plotly/plotly.js/issues/720 for the most up-to-date development info.

About #2, I guess this is a matter of preference. At the moment, hovermode: 'x' means show labels for all points close to the mouse x position. If you open a feature request on Github, we’ll consider it.

You can also consider using fully custom hover labels using https://plot.ly/javascript/hover-events/#triggering-hover-events to get the behavior you’re hoping for.