Python 数据表到卡回调
我在破折号中有一个DataTable,我想在其中选择一个表行,并让卡片组件内容更新该选择。我想不出正确的回调方法。下面是一些代码Python 数据表到卡回调,python,plotly-dash,Python,Plotly Dash,我在破折号中有一个DataTable,我想在其中选择一个表行,并让卡片组件内容更新该选择。我想不出正确的回调方法。下面是一些代码 df2 = pd.DataFrame({ 'animal': ['falcon','dog','spider','fish'], 'super_hero': ['Falcon', 'Scooby-Doo', 'Spider-Man', 'Aquaman'], 'num_legs'
df2 = pd.DataFrame({
'animal': ['falcon','dog','spider','fish'],
'super_hero': ['Falcon', 'Scooby-Doo', 'Spider-Man', 'Aquaman'],
'num_legs': [2, 4, 8, 0],
'num_wings': [2, 0, 0, 0],
'num_specimen_seen': [10, 2, 1, 8]},
)
app.layout = dbc.Container([
dbc.Row([
dbc.Col([
dash_table.DataTable(
id='table',
columns=[{"name": i, "id": i} for i in df2.columns],
data=df2.to_dict('records'),
editable=False,
filter_action="native",
sort_action="native",
sort_mode="multi",
column_selectable="single",
row_selectable="single",
row_deletable=False,
selected_columns=[],
selected_rows=[],
page_action="native",
page_current=0,
page_size=15,
)
]),
]),
dbc.Row([
dbc.Col(dbc.Card([
dbc.CardBody([
html.H4("Card title", className="card-title", id="card_num1"),
html.P("Current Population", className="card-text",id="card_text1")
]),
])),
dbc.Col(dbc.Card(card_content, color="secondary", inverse=True)),
dbc.Col(dbc.Card(card_content, color="info", inverse=True)),
], className="mb-4",),
])
@app.callback([
Output('card_num1','children'),],
Input('table','value')
)
def update_card(slct_rows_names):
print('***************************************************************************')
print(slct_rows_names)
print("Names of selected rows if part of table after filtering: {}".format(slct_rows_names))
理想情况下,在选定一行之后。我希望每张卡片都显示列文本。例如,如果选择了带有spider的行,则第一个卡片文本将更新为animal(“spider”)的值。下一张卡片文本将更新为超级英雄(“蜘蛛侠”)的值。最后一张卡片文本将显示num_legs(8)的值
现在我无法获取任何要打印的值。
值
不是数据表的有效属性。您可以改为使用:
活动单元格(dict;可选):当前活动单元格的行、列索引和ID。仅当数据行具有id键时,才会返回行\ id
活动_单元是带有键的dict:
- 列(编号;可选)
- 列id(字符串;可选)
- 行(编号;可选)
- 行id(字符串编号;可选)
因此,您可以在这里使用活动单元格的列_id
和行
,从数据帧中检索与活动列id和行对应的值:
@app.callback(Output("card_num1", "children"), Input("table", "active_cell"))
def update_card(slct_rows_names):
if slct_rows_names:
col = df2[slct_rows_names["column_id"]]
val = col[slct_rows_names["row"]]
return val
return card_content # default value if no active cell
完整示例:
from dash import Dash
import pandas as pd
import dash_bootstrap_components as dbc
import dash_html_components as html
from dash.dependencies import Input, Output
import dash_table
app = Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])
card_content = "default card content"
df2 = pd.DataFrame(
{
"animal": ["falcon", "dog", "spider", "fish"],
"super_hero": ["Falcon", "Scooby-Doo", "Spider-Man", "Aquaman"],
"num_legs": [2, 4, 8, 0],
"num_wings": [2, 0, 0, 0],
"num_specimen_seen": [10, 2, 1, 8],
},
)
app.layout = dbc.Container(
[
dbc.Row(
[
dbc.Col(
[
dash_table.DataTable(
id="table",
columns=[{"name": i, "id": i} for i in df2.columns],
data=df2.to_dict("records"),
editable=False,
filter_action="native",
sort_action="native",
sort_mode="multi",
column_selectable="single",
row_selectable="single",
row_deletable=False,
selected_columns=[],
selected_rows=[],
page_action="native",
page_current=0,
page_size=15,
)
]
)
]
),
dbc.Row(
[
dbc.Col(
dbc.Card(
dbc.CardBody(
[
html.H4(
"Card title", className="card-title", id="card_num1"
),
html.P(
"Current Population",
className="card-text",
id="card_text1",
),
]
)
)
),
dbc.Col(dbc.Card(card_content, color="secondary", inverse=True)),
dbc.Col(dbc.Card(card_content, color="info", inverse=True)),
],
className="mb-4",
),
]
)
@app.callback(Output("card_num1", "children"), Input("table", "active_cell"))
def update_card(slct_rows_names):
if slct_rows_names:
col = df2[slct_rows_names["column_id"]]
val = col[slct_rows_names["row"]]
return val
return card_content
if __name__ == "__main__":
app.run_server(debug=True)