Vertical Line On Hover


I have an application with many lines plotted against one another, and rather than the typical number comparison I’d rather use a vertical rule to visually compare many lines, something like…

Is there a straightforward way to do this in Dash? I’ve disable the hover text successfully, looking to add the line.

Thanks in advance.


There is a feature in the plotly mode bar called “spike lines” which almost does what you describe:

Does that work for you? You can set this as the default interaction mode with

figure = {
    'data': [...],
    'layout': {
        'hovermode': 'closest',
        'xaxis': {'showspikes': True}

The style of the spikes is customizable as well:


Thanks! Will use that for now, but an hline / vline type hover would be handy for a few ways of looking at data.


Yeah, I agree that this could be helpful. I’ve created an issue in plotly.js here: Thanks for reporting!


The plotly.js team just informed me about spikemode: across: Seems like this would work in this case.