danvk / dygraphs

Interactive visualizations of time series using JavaScript and the HTML canvas tag
http://dygraphs.com
Other
3.17k stars 606 forks source link

Crosshair renders behind the graph #923

Open VikaCep opened 6 years ago

VikaCep commented 6 years ago

The vertical line added by the crosshair plugin is showing behind the painted area of the graph, which is particularly noticeable in stacked graphs that occupy a big portion of the canvas, like in a chart like this:

screen shot 2018-04-20 at 14 19 05

You can see that the red and blue parts of the chart are on top of the crosshair line.

Is there a way that could be configured or fixed so that the line shows on top of the painted area?

andnorxor commented 4 years ago

In case two years later someone has still this question: You can do this with pure css. The crosshair plugin creates a canvas element add z-index: 1; and pointer-events: none; to it.

With z-index:1 you move the crosshair in front of all other canvas. With pointer-events: none; you make sure that all pointer (ex.: zoom select) events pass trough the canvas and you don't block dygraphs interaction methods.