Как мне добавить вертикальную линию наведения на мою диаграмму plotly

#python-3.x #plotly #onhover

#python-3.x #plotly #onhover

Вопрос:

Я пытаюсь добиться того, что сделано здесь:https://www.quantalys.com/Fonds/120955 с помощью javascript в python plotly. Я хочу добавить вертикальную линию наведения и красную аннотацию по оси x. Я выполнил некоторый поиск в goolgle, но я не смог найти ответ, который я ищу. Мой текущий график выглядит следующим образом:

 trace1 = go.Scatter(
x = df1.x,
y = df1.y,
name = "Mamp;G OPTIMAL INCOME FD EUR AH ACC",
hoverinfo= 'name',
opacity=0.7,
mode = 'lines',
    line = dict(
    color = ('rgb(2, 12, 245)'),
    width = 1,
    ), 
)
trace2 = go.Scatter(
x = df2.x,
y = df2.y,
opacity=0.7,
name = "Alloc Flexible Prudent Monde",
hoverinfo= 'name',
mode = 'lines',
    line = dict(
    color = ('rgb(67, 45, 24)'),
    width = 1,
    )
)
trace3 = go.Scatter(
x = df3.x,
y = df3.y,
name = "25% MSCI World   75% ML Global",
hoverinfo= 'name',
mode = 'lines',
opacity=0.7,
line = dict(
    color = ('rgb(205, 12, 24)'),
    width = 1,
    )
)

layout = go.Layout(

xaxis=dict(        
    showline=True,
    showgrid=True,
    showticklabels=True,
    linecolor='rgb(204, 204, 204)',
    linewidth=2,
    mirror=True,
),
yaxis=dict(
            showline=True,
    showgrid=True,
    showticklabels=True,
    linecolor='rgb(204, 204, 204)',
    linewidth=2,
    mirror=True,
),
showlegend=True,

)

data= [trace1, trace2,trace3]
fig = dict(data=data, layout=layout)
iplot(fig, filename='line-mode')
  

Ответ №1:

Добавьте это в свое определение макета.

 showlegend = True,
hovermode  = 'x'
  

Добавьте это в свое определение xaxis.

 showspikes = True,
spikemode  = 'across',
spikesnap = 'cursor',
showline=True,
showgrid=True,
...
  

И добавьте это в свое определение макета:

 spikedistance =  -1,
xaxis=dict(...  

  

Пожалуйста, обратитесь к этому сообщению и документации от plotly. 🙂

Редактировать

Вы запрашиваете ярлык по оси x. Пожалуйста, используйте

 spikemode  = 'across toaxis'
  

Кроме того, я бы предложил использовать

 spikedash = 'solid'
  

потому что это лучше соответствует вашему примеру.

Комментарии:

1. Я знаю, что это не идеальная копия вашего исходного кода, но она уже очень близка. Может быть, вы немного поэкспериментируете самостоятельно. 🙂

2. Спасибо за ответ. Также добавляем spikedash = ‘solid’

3. Замечательно, рад, что смог помочь!

4. Вы знаете, как я мог бы добавить красную аннотацию и по оси x?

5. Что конкретно вы имеете в виду?