Python 数据表到卡回调

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'

我在破折号中有一个DataTable,我想在其中选择一个表行,并让卡片组件内容更新该选择。我想不出正确的回调方法。下面是一些代码

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)