如何返回由 2 个下拉列表更新的数据表作为 Plotly Python 中的输入
Posted
技术标签:
【中文标题】如何返回由 2 个下拉列表更新的数据表作为 Plotly Python 中的输入【英文标题】:How to return a datatable updated by 2 dropdowns as inputs in Plotly Python 【发布时间】:2020-06-18 18:22:57 【问题描述】:如标题所示,我正在创建一个仅包含数据表的绘图仪表板。将有 2 个下拉菜单作为输入,数据表将根据下拉菜单更新。如何设置布局和回调?
import pandas as pd
import dash
import dash_core_components as dcc
import dash_html_components as html
import dash_table as dt
from dash.dependencies import Input, Output, State
df = pd.read_csv(data, header=0, encoding = 'utf8')
app = dash.Dash()
application = app.server
dropdown = html.Div([html.Label('district'),
dcc.Dropdown(id='dropdown_d',
options=['label': i, 'value': i for i in df["district"].unique()], value='none'),
html.Label('address'),
dcc.Dropdown(id='dropdown_a',
options=['label': i, 'value': i for i in df["address"].unique()], value='none')])
final_table = html.Div([dash_table.DataTable(id="final_table")])
app.layout = html.Div([dropdown, final_table])
@app.callback(Output('final_table', 'data'),
[Input('dropdown_d', 'value'),
])
def update_table(selected_value):
df = pd.read_csv(data, header=0, encoding = 'utf8')
df_updated = df[df["district"] == selected_value]
columns = ['name': i, 'id': i for i in df_updated.columns]
data = df.to_dict('records')
return columns, data
if __name__ == "__main__":
app.run_server(debug=True, port=8055)
这是我能到达的最远的地方。上面的代码只是试图从 1 个下拉值更新数据表,但我的目标是更新 2 个下拉值。
非常感谢任何帮助。 如果需要数据文件,这里是data的链接。
【问题讨论】:
【参考方案1】:这里是工作代码的sn-p,我已经添加了cmets来澄清,
import pandas as pd
import dash
import dash_core_components as dcc
import dash_html_components as html
import dash_table as dt
from dash.dependencies import Input, Output, State
df = pd.read_csv("https://elartedm.com/wp-content/uploads/2020/03/data_hk.csv", header=0, encoding = 'utf8')
app = dash.Dash()
application = app.server
dropdown = html.Div([
html.Label('district'),
dcc.Dropdown(id='dropdown_d1', options=['label': i, 'value': i for i in df["District"].unique()], value=None),
html.Label('address'),
dcc.Dropdown(id='dropdown_d2', options=[], value=None)
])
#its better to have a Div here so that you can update the entire div in the callback and add the necessary properties in the callback
final_table = html.Div(id="final_table")
app.layout = html.Div([dropdown, final_table])
#callback to update second dropdown based on first dropdown
#This callback is used to update the second dropdown based on the value selected in the first dropdown so that its dynamically updated (this is a good practice rather than having a static list of options).
@app.callback(Output('dropdown_d2', 'options'),
[
Input('dropdown_d1', 'value'),
])
def update_dropdown_2(d1):
print(d1)
if(d1 != None):
df_filtered = df[(df["District"]==d1)]
return ['label': i, 'value': i for i in df_filtered["Address"].unique()]
else:
return []
#this callback to update the final table should be based on both the input dropdown values, so the input parameters are two dropdown_d1, dropdown_d2
#based on these values filter the dataframe and update the table
#since dataframe is a global declaration you don't need to again consume it here.
@app.callback(Output('final_table', 'children'),
[
Input('dropdown_d1', 'value'),
Input('dropdown_d2', 'value'),
])
def update_table(d1, d2):
if(d1 != None and d2 != None):
df_filtered = df[(df["District"]==d1) & (df["Address"]==d2)]
return [dt.DataTable(
id='table',
columns=["name": i, "id": i for i in df_filtered.columns],
data=df_filtered.to_dict('records'),
)]
else:
print("none")
return []
if __name__ == "__main__":
app.run_server(debug=True, port=8055)
希望对你有帮助。
【讨论】:
它就像魔术一样,非常感谢@Lawliet!我现在正在尝试理解它,并且会在一段时间内回来。 更新:再次感谢您的回答。我回来了,请教一下,现在final_table这里没有给孩子起名字,但是为什么系统有时候会报错说没有指定孩子呢? @yts61 我不太确定这个错误,我可能在这里遗漏了一些极端情况,如果你能让我知道如何重新创建问题,我可以尝试找出是什么导致错误。以上是关于如何返回由 2 个下拉列表更新的数据表作为 Plotly Python 中的输入的主要内容,如果未能解决你的问题,请参考以下文章
miniui菜鸟求解答关于ComboBox,如何实现下拉列表从数据库获取