Plotly: Constant Spike lines for Candlestick Charts

Viewed 1318

I am currently trying to add spikelines to my candlestick chart on Plotly in Python.

I want the spikeline to follow the y-coordinates of my cursor/mouse no matter where my cursor is on the chart. But right now, I can only get a spikeline when my cursor is on a candle.

I have the following code for spikelines:

fig.update_yaxes(showspikes = True, spikecolor = '#FB75FF', spikedash = 'solid',
                     spikesnap = 'cursor', spikemode = 'across', spikethickness = 1)
    fig.update_layout(spikedistance = 1000, hoverdistance = 100)

It would also be nice if I can display the y-coordinate on the edge of the chart.

Is this possible?

Thank you.

3 Answers

Try

fig.update_layout(hovermode="x unified")

Add

fig.update_yaxes(showline=True)

fig.update_layout(hovermode='x', spikedistance=-1)

No need for hoverdistance.

Just include:

fig.update_layout(hoverdistance=0)

Example plot:

enter image description here

Complete code:

import pandas as pd
import numpy as np
import plotly.graph_objs as go
from plotly.subplots import make_subplots

df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv').iloc[:60]
fig = make_subplots(rows=2, cols=1, row_heights=[0.8, 0.2], vertical_spacing=0)

fig.add_trace(go.Candlestick(open=df['AAPL.Open'], high=df['AAPL.High'], low=df['AAPL.Low'], close=df['AAPL.Close'],
                             increasing_line_color='#0384fc', decreasing_line_color='#e8482c', name='AAPL'), row=1, col=1)

fig.add_trace(go.Scatter(y=np.random.randint(20, 40, len(df)), marker_color='#fae823', name='VO', hovertemplate=[]), row=2, col=1)

fig.update_layout({'plot_bgcolor': "#21201f", 'paper_bgcolor': "#21201f", 'legend_orientation': "h"},
                  legend=dict(y=1, x=0),
                  font=dict(color='#dedddc'), dragmode='pan', hovermode='x unified',
                  margin=dict(b=20, t=0, l=0, r=40))

fig.update_yaxes(showgrid=False, zeroline=False, showticklabels=False,
                 showspikes=True, spikemode='across', spikesnap='cursor', showline=False, spikedash='solid')

fig.update_xaxes(showgrid=False, zeroline=False, rangeslider_visible=False, showticklabels=False,
                 showspikes=True, spikemode='across', spikesnap='cursor', showline=False, spikedash='solid')

fig.update_layout(hoverdistance=0)

fig.update_traces(xaxis='x', hoverinfo='none')
fig.show()
Related