我想在 plotly dash 中绘制一个带有两个子图的图表。我的整个图表如下所示:
import pandas as pd
import numpy as np
import dash
import dash_core_components as dcc
import dash_html_components as html
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_xaxes(showgrid=False, zeroline=False, rangeslider_visible=False, showticklabels=False,
showspikes=True, spikemode='across', spikesnap='data', showline=False, spikedash='solid')
fig.update_yaxes(showgrid=False, zeroline=False)
fig.update_traces(xaxis='x', hoverinfo='none')
app = dash.Dash(__name__)
app.layout = html.Div(children=[
html.Div(dcc.Graph(id='chart', figure=fig, config={'displayModeBar': False}))])
if __name__ == '__main__':
app.run_server(debug=True, dev_tools_ui=False, dev_tools_props_check=False)
我需要的是交易图表中常见的所谓十字准线。基本上它由连接到 x 和 y 轴并随光标移动的两条线组成。这是来自 tradeview.com 图表的屏幕截图:
但是,在我的图表中,当光标位于烛台上时会出现一个小图标:
到目前为止我发现的是,当光标位于散点图上时,图标消失并且工作正常。我想那是因为我设置了
hovertemplate=[]
在散点图中。我不能在烛台图中这样做,因为它没有这样的参数。此外,这个图标只有在我设置 hovermode='x unified'
时才会出现.如果我将其设置为 x,则不会出现小图标。但我需要它与我展示的 tradeview.com 示例完全一样。有没有办法复制那个十字准线?
更新 1:
我试过
fig.update_layout(hoverdistance=0)
.但问题是,当光标不在烛台上时,十字准线就是不对的。我截取了两张截图:第一个来自 Tradingview.com 图表,第二个来自我的代码 hoverdistance
设置为 0。 可以看出,当光标不在烛台上时,在第一个屏幕截图中,十字准线仍然正确。但是,在第二个屏幕截图中,它无法正常工作。仅当光标位于烛台上时才有效。
我只想复制tradingview.com十字准线。仅此而已。
更新 2:
我认为答案可能就在这些 plotly docs 上.我目前正在研究它。请分享您对此更新的意见。
最佳答案
这应该这样做:
fig.update_layout(hoverdistance=0)
并设置
spikesnap='cursor'
对于 xaxes 和 yaxes。这些小调整将保持十字准线完好无损,并删除一直困扰您的小图标。
来自 the docs :
剧情:
hoverdistance
Sets the default distance (in pixels) to look for data to add hover labels (-1 means no cutoff, 0 means no looking for data). This is only a real distance for hovering on point-like objects, like scatter points. For area-like objects (bars, scatter fills, etc) hovering is on inside the area and off outside, but these objects will not supersede hover on point-like objects in case of conflict.
完整代码: (但没有破折号元素)
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()
关于python - Plotly:如何仅将垂直和水平线(十字准线)显示为 hoverinfo?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61794582/