我正在使用python 3.6.5和plotly 3.9.0创建交互式折线图,用户可以使用游标幻灯片更改范围。
我想向范围滑块添加一个悬停工具,以便当用户移动滑块时,悬停图标会在用户释放鼠标之前说出新的日期范围。
我认为这是bokeh的默认设置,但我已经放弃了,转而使用散点图。
可以做到吗?
下面是我要尝试做的一个最小工作示例。
import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
import plotly.plotly as py
from datetime import datetime
import pandas as pd
import numpy as np
np.random.seed(10)
df = pd.DataFrame({
'date':pd.date_range(start='1/1/2000', periods=200),
'x': np.random.choice(range(100),200)
})
app = dash.Dash()
app.layout = html.Div([
dcc.Graph(
id='graph',
),
dcc.RangeSlider(
id='slider',
min = df['date'].min().timestamp(),
max = df['date'].max().timestamp(),
value=[df.iloc[-101]['date'].timestamp(), df.iloc[-1]['date'].timestamp()]
)
])
@app.callback(
dash.dependencies.Output('graph','figure'),
[dash.dependencies.Input('slider','value')])
def update_figure(value):
lBound = pd.to_datetime(value[0], unit='s')
uBound = pd.to_datetime(value[1], unit='s')
filteredData = df.loc[(df['date']>=lBound) & (df['date']<=uBound)]
fig = [
go.Scatter(
x=filteredData['date'],
y=filteredData['x'],
mode='lines',
name='xxxx'
)
]
layout = go.Layout(
xaxis={'title': ' '},
yaxis={'title': 'per cent'},
hovermode='closest')
return {'data':fig,'layout':layout}
if __name__ == '__main__':
app.run_server(debug=True)
答案 0 :(得分:2)
目前,{{1}上的hovering
上的slider
上的plotly
没有功能。
您可以查看Slider和RangeSlider的文档。
我知道这不是您想要的,但是使用dash
可以使滑块更容易知道位置。
marks
将您的dcc.RangeSlider(
id='slider',
min = df['date'].min().timestamp(),
max = df['date'].max().timestamp(),
value=[df.iloc[-101]['date'].timestamp(), df.iloc[-1]['date'].timestamp()],
marks={
955411200: {'label': '2000-04-11', 'style': {'color': '#77b0b1'}},
959644800: {'label': '2000-05-30'},
957484800: {'label': '2000-05-05'},
961804800: {'label': '2000-06-24', 'style': {'color': '#f50'}}
}
)
更改为此。可能总比不悬停好。
否则,您可以使用dcc.RangeSlider
,但仅限于Slider Widget
。