python plotly - hovering shows more than one value sometimes

Question

The Problem

I have a plotly graph (figure) composed of multiple go.Scatter graphs, added to the graph using fig.add_trace(<the_data>).

Some scatters share the same indices, and some don't. When hovering above a connection between two graphs which don't share the same incides I see more than one label.

In the picture you can see an example of this: instead of seeing just the green label or just the blue+red (they compose one unit because they share the same incides), I see both. How can I make it show only one of them?

NOTES:

1. When hovering above a spot which isn't a connection between two segments, I do get the desired result: green if I'm above green, and blue+red if I'm above blue+red.
2. I tried changing the hovermode parameter from the default 'x', but couldn't find a mode that works. The closest option was closest, but using it only shoes one color: green or blue or red and not green or blue+red as desired.
3. When zooming in enough, it shows the desired labels (but making the user zoom in all the time is, of course, not a solution).

---

The Code

import plotly.graph_objs as go
import numpy as np

sc0 = go.Scatter({
    'x': np.array(['21/Jun/09 11:03', '21/Jun/09 11:04'], dtype=object),
    'y': np.array([17.407997, 17.372826], dtype=np.float32)
})

sc1 = go.Scatter({
    'x': np.array(['21/Jun/09 11:03', '21/Jun/09 11:04'], dtype=object),
    'y': np.array([17.352034, 17.33715], dtype=np.float32)
})
sc2 = go.Scatter({
    'x': np.array(['21/Jun/09 11:05', '21/Jun/09 11:06', '21/Jun/09 11:07',
                '21/Jun/09 11:08', '21/Jun/09 11:09', '21/Jun/09 11:10',
                '21/Jun/09 11:11', '21/Jun/09 11:12', '21/Jun/09 11:13',
                '21/Jun/09 11:14', '21/Jun/09 11:15', '21/Jun/09 11:16',
                '21/Jun/09 11:17', '21/Jun/09 11:18', '21/Jun/09 11:19',
                '21/Jun/09 11:20', '21/Jun/09 11:21', '21/Jun/09 11:22',
                '21/Jun/09 11:23', '21/Jun/09 11:24', '21/Jun/09 11:25',
                '21/Jun/09 11:26', '21/Jun/09 11:27', '21/Jun/09 11:28',
                '21/Jun/09 11:29', '21/Jun/09 11:30', '21/Jun/09 11:31',
                '21/Jun/09 11:32', '21/Jun/09 11:33', '21/Jun/09 11:34',
                '21/Jun/09 11:35', '21/Jun/09 11:36', '21/Jun/09 11:37',
                '21/Jun/09 11:38', '21/Jun/09 11:39', '21/Jun/09 11:40',
                '21/Jun/09 11:41', '21/Jun/09 11:42', '21/Jun/09 11:43',
                '21/Jun/09 11:44', '21/Jun/09 11:45', '21/Jun/09 11:46',
                '21/Jun/09 11:47', '21/Jun/09 11:48', '21/Jun/09 11:49',
                '21/Jun/09 11:50', '21/Jun/09 11:51', '21/Jun/09 11:52',
                '21/Jun/09 11:53', '21/Jun/09 11:54', '21/Jun/09 11:55',
                '21/Jun/09 11:56', '21/Jun/09 11:57', '21/Jun/09 11:58',
                '21/Jun/09 11:59', '21/Jun/09 12:00', '21/Jun/09 12:01',
                '21/Jun/09 12:02', '21/Jun/09 12:03', '21/Jun/09 12:04',
                '21/Jun/09 12:05', '21/Jun/09 12:06', '21/Jun/09 12:07'], dtype=object),
    'y': np.array([17.340586, 17.058613, 17.268505, 17.234064, 17.699133, 17.164728,
                17.129848, 17.094318, 17.058613, 17.020906, 16.992136, 16.98427 ,
                16.988392, 17.00848 , 17.031954, 17.051336, 17.054792, 17.041235,
                17.029837, 17.058613, 16.801, 16.969503, 16.235737, 16.97139 ,
                16.801, 16.977226, 16.965315, 16.958202, 16.235737, 16.955463,
                16.029837, 17.052027, 17.058613, 17.235737, 17.332283, 17.239872,
                17.129492, 17.058096, 16.801, 16.81308 , 16.699133, 16.591547,
                16.490868, 16.403502, 16.321527, 16.411316, 16.801, 16.698566,
                16.810646, 16.893055, 16.235737, 17.058613, 17.060478, 17.033163,
                16.998907, 16.966124, 16.235737, 16.911512, 16.886219, 16.235737,
                16.839949, 16.235737, 16.801], dtype=np.float32)
})

data = [sc0, sc1, sc2]

layout = go.Layout(
        margin=dict(t=20, l=40, r=20, b=40),
        hovermode='x'
    )

fig = go.Figure(layout=layout)
for item in data:
    fig.add_trace(item)
fig.show()

---

Graph Example

Answer 1

You can set the hoverdistance manually. Setting it to 2 pixels should solve the problem for you:

layout = go.Layout(
    margin=dict(t=20, l=40, r=20, b=40),
    hovermode='x',
    hoverdistance=2,
)

In other words, now the cursor needs to be 2 pixels close to a point (along x axis) to show its hover.