在 Dash 中点击图表更新视频源 Python
Updating video source on graph click in Dash Python
我的应用程序布局中有一个 html.video 元素以及一个图表,当我单击图表中的一个元素时,我想将视频元素更新为与数据集的该部分对应的视频.
以下是我设置应用程序布局的方式。
app.layout = html.Div([
html.H1("Belfast Harbor Data Overview", style ={'text-align': 'center'}),
#Droptown for machine type
dcc.Dropdown(id="slct_machine",
options=[{'label': k, 'value': k} for k in all_options.keys()],
multi=False,
value=options1[0],
style={'width': "70%"}
),
#Dropdown for date
dcc.Dropdown(id="selct_date",
style={'width': "70%"},
),
#HTML Break
html.Br(),
dcc.Graph(id='hist', figure={}, style={'width': "90%"},
config={
'staticPlot': False, # True, False
'scrollZoom': True, # True, False
'doubleClick': 'reset', # 'reset', 'autosize' or 'reset+autosize', False
'showTips': False, # True, False
'displayModeBar': True, # True, False, 'hover'
'watermark': True,
# 'modeBarButtonsToRemove': ['pan2d','select2d'],
},),
html.Video(
controls=True,
id='video_player',
src={},
autoPlay=False,
style={'width': "70%"}
),
在此之后,我有一些图形回调函数和一个用数据填充图形的函数。
在此之后,我有另一个应用程序回调,在这里我试图用一些测试数据更新视频播放器。我这样做如下:
@app.callback (
Output('video_player', 'src'),
[Input('hist', 'clickData')]
)
def updateVideo(clk_data, src):
if clk_data is None:
video_src = "https://www.w3schools.com/html/mov_bbb.mp4"
else:
print(f'hover data: {clk_data}')
video_src = "http://techslides.com/demos/sample-videos/small.webm"
return video_src
我在执行此操作时收到以下回调错误:
我不太确定为什么 src 没有更新,因为传递组件对于图形和容器来说似乎是这样工作的。
该应用程序还有其他元素,但我认为它们并不重要,因为视频源是未更新的部分。
如果需要我可以提供所有代码,但我觉得我只是错误地更新了视频源。
函数定义中的参数数量(目前为两个)必须与回调的输入数量(+状态数量)相匹配(目前为一个)。因此,您应该删除(未使用的)src 参数,或添加另一个输入或状态。
我的应用程序布局中有一个 html.video 元素以及一个图表,当我单击图表中的一个元素时,我想将视频元素更新为与数据集的该部分对应的视频.
以下是我设置应用程序布局的方式。
app.layout = html.Div([
html.H1("Belfast Harbor Data Overview", style ={'text-align': 'center'}),
#Droptown for machine type
dcc.Dropdown(id="slct_machine",
options=[{'label': k, 'value': k} for k in all_options.keys()],
multi=False,
value=options1[0],
style={'width': "70%"}
),
#Dropdown for date
dcc.Dropdown(id="selct_date",
style={'width': "70%"},
),
#HTML Break
html.Br(),
dcc.Graph(id='hist', figure={}, style={'width': "90%"},
config={
'staticPlot': False, # True, False
'scrollZoom': True, # True, False
'doubleClick': 'reset', # 'reset', 'autosize' or 'reset+autosize', False
'showTips': False, # True, False
'displayModeBar': True, # True, False, 'hover'
'watermark': True,
# 'modeBarButtonsToRemove': ['pan2d','select2d'],
},),
html.Video(
controls=True,
id='video_player',
src={},
autoPlay=False,
style={'width': "70%"}
),
在此之后,我有一些图形回调函数和一个用数据填充图形的函数。
在此之后,我有另一个应用程序回调,在这里我试图用一些测试数据更新视频播放器。我这样做如下:
@app.callback (
Output('video_player', 'src'),
[Input('hist', 'clickData')]
)
def updateVideo(clk_data, src):
if clk_data is None:
video_src = "https://www.w3schools.com/html/mov_bbb.mp4"
else:
print(f'hover data: {clk_data}')
video_src = "http://techslides.com/demos/sample-videos/small.webm"
return video_src
我在执行此操作时收到以下回调错误:
我不太确定为什么 src 没有更新,因为传递组件对于图形和容器来说似乎是这样工作的。
该应用程序还有其他元素,但我认为它们并不重要,因为视频源是未更新的部分。
如果需要我可以提供所有代码,但我觉得我只是错误地更新了视频源。
函数定义中的参数数量(目前为两个)必须与回调的输入数量(+状态数量)相匹配(目前为一个)。因此,您应该删除(未使用的)src 参数,或添加另一个输入或状态。