图表未使用下拉列表更新(虚线绘图)

Question

我正在尝试构建一个仪表板，其中图形会根据下拉菜单中传递的值进行更新。

由于某种原因，图形不适应下拉列表中的任何更改。这方面的特点是：

1. 输入肯定已收到：我创建了第二个函数，它具有相同的结构，但更新了不同的字段。它工作正常。

2. 问题似乎出在图形显示上：我创建了一个不同版本的函数，其中更新函数将返回默认值 1 的"none"。图形的区域起初是空的，但在下拉列表中选择新值时将更改为其中一个图形。显示图表后，该字段将不会对下拉菜单中的任何进一步更改做出反应：无论是提示新图形的值还是返回默认值 none 。

这是代码：

import dash
from dash.dependencies import Output, Event
import dash_core_components as dcc
import dash_html_components as html
import plotly
import plotly.graph_objs as go
from dash.dependencies import Input, Output
import collections

app = dash.Dash()
df = dm.return_all_pd_data(token = API_TOKEN)
app.layout = html.Div(children=[
html.H1(children='''
Month for graph:
'''),
dcc.Dropdown(
id = "input",
options=[
{'label': 'Jan', 'value': 1},
{'label': 'Feb', 'value': 2},
{'label': 'Mar', 'value': 3}
], value = 1
),
html.Div(id='output-graph'),
])
@app.callback(
Output(component_id='output-graph', component_property='children'),
[Input(component_id='input', component_property='value')])
def update_value(value):
start = datetime.datetime(2018, value, 1, 0, 0, 0, 1)
end = datetime.datetime(2018,  value + 1, 1, 0, 0, 0, 1)
subset_df = df[ (df["lost_time"] > start) & (df["lost_time"] < end) ]
x = pd.value_counts(subset_df.deal_source).index
y = pd.value_counts(subset_df.deal_source).values
return(dcc.Graph(
id='output-graph',
figure={
'data': [
{'x': x, 'y': y, 'type': 'bar', 'name': value},
],
'layout': {
'title': "You selected month: {}".format(value)
}
}
))

if __name__ == "__main__":
app.run_server(debug = True)

Answer 1

我最终能够自己找到解决方案。在这里回答，以防其他人可能有同样的问题。

问题是我正在尝试更新div 标签中的子元素。相反，事实证明，创建一个空图表并编写函数来更新图表的图形元素要容易得多。

以下是事实证明有效的代码：

app = dash.Dash()
app.layout = html.Div(children=[
html.H1(children='''
Interactive Chart:
'''),
dcc.Dropdown(
id = "input",
options=[
{'label': 'January', 'value': 1},
{'label': 'Febuary', 'value': 2},
{'label': 'March', 'value': 3}
], value = 1
),
dcc.Graph( id="output-graph")
])
@app.callback(
Output(component_id='output-graph', component_property='figure'),
[Input(component_id='input', component_property='value')])
def update_value(value):
start = datetime.datetime(2018, value, 1, 0, 0, 0, 1)
end = datetime.datetime(2018,  value + 1, 1, 0, 0, 0, 1)
subset_df = df[ (df["lost_time"] > start) & (df["lost_time"] < end) ]
x = pd.value_counts(subset_df.deal_source).index
y = pd.value_counts(subset_df.deal_source).values
return({'data': [
{'x': x, 'y': y, 'type': 'bar', 'name': value},
],
'layout': {
'title': "Deal Flow source for {} 2018".format(months[value-1])
}
}
)
if __name__ == "__main__":
app.run_server(debug = True)