仪表板表回调

时间:2019-11-11 15:44:00

标签: python callback plotly-dash

我正在尝试获取滑块,用户输入和工作表之间的依赖关系。我尝试输出数据并使用回调对其进行更新。建议我在回调中创建表,然后使用“ Div”。定义其在显示器中的位置。

其他信息:

  • 表是使用dash_table库从pandas DataFrame创建的。
  • 数据采用字典格式。
  • 变量threshold是由用户输入(滑块或输入)调整的值

如果有人可以帮助我找出表格未显示的原因,我将不胜感激?

这是我的代码:


import dash
import dash_bootstrap_components as dbc
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
from dash.dependencies import Input, Output
import dash_table

threshold = 0.5
################################################################
###################### Table Data ##############################
################################################################

metrics_index = ["AUC", "Accuracy", "Kappa", "Sensitivity (Recall)", "Specificity", "Precision", "F1"]

algo_columns = ["Test-SVM+Naïve B", "RF"]

table_data = {"AUC": [threshold * 0.8, threshold * 0.83],
              "Accuracy": [threshold * 0.85, threshold * 0.86],
              "Kappa": [threshold * 0.66, threshold * 0.69],
              "Sensitivity (Recall)": [threshold * 0.82, threshold * 0.83],
              "Specificity": [threshold * 0.78, threshold * 0.79],
              "Precision": [threshold * 0.78, threshold * 0.79],
              "F1": [threshold * 0.81, threshold * 0.82]}

data = [i for i in table_data]
table = pd.DataFrame(columns=algo_columns, index=metrics_index, data=[table_data[i] for i in metrics_index])
# display(table)


################################################################
########################  Body  ################################
################################################################


body = dbc.Container(
    [
        dbc.Row(
            [
                dbc.Col(
                    [
                        html.H2("Slider + Manual entry test"),
                        dcc.Slider(
                            id='my-slider',
                            min=0,
                            max=1,
                            step=0.01,
                            marks={"0": "0", "0.5": "0.5", "1": "1"},
                            value=threshold
                        ),
                        html.Div(id='update-table')
                    ]
                ),
                dbc.Col(
                    [
                        html.Div(
                            [
                                html.Div(
                                    dcc.Input(id='input-box', type='float', max=0, min=1, step=0.01, value=threshold)
                                    ),
                                 html.Div(id='slider-output-container')
                            ]
                        )
                    ]
                )
            ]
        )
    ]
)

app = dash.Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = html.Div([body])


##############################################################
######################## callbacks ###########################
##############################################################

@app.callback(
    dash.dependencies.Output('slider-output-container', 'children'),
    [dash.dependencies.Input('my-slider', 'value')]
)
def update_output(value):
    threshold = float(value)
    return threshold


# call back for slider to update based on manual input
@app.callback(
    dash.dependencies.Output(component_id='my-slider', component_property='value'),
    [dash.dependencies.Input('input-box', 'value')]
)
def update_output(value):
    threshold = float(value)
    return threshold


# call back to update table

@app.callback(
    dash.dependencies.Output('update-table', 'children'),
    [dash.dependencies.Input('my-slider', 'value')]
)
def update_output(value):
    threshold = float(value)
    table_data = {"AUC": [threshold * 0.8, threshold * 0.83],
                  "Accuracy": [threshold * 0.85, threshold * 0.86],
                  "Kappa": [threshold * 0.66, threshold * 0.69],
                  "Sensitivity (Recall)": [threshold * 0.82, threshold * 0.83],
                  "Specificity": [threshold * 0.78, threshold * 0.79],
                  "Precision": [threshold * 0.78, threshold * 0.79],
                  "F1": [threshold * 0.81, threshold * 0.82]}


    return dash_table.DataTable(
                            id='update-table',
                            data= table_data.to_dict('records'),
                            columns=[{'id': x, 'name': x} for x in table.columns]
                )


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

1 个答案:

答案 0 :(得分:2)

[screenshot of table live dynamic editing]

result = (this->*(*iter))();

我尝试了这个,并且似乎在上面稍加修改的代码下工作了;我必须进行的更改是:

  1. 将字典import dash import dash_bootstrap_components as dbc import dash_core_components as dcc import dash_html_components as html import dash_table import pandas as pd from dash.dependencies import Input, Output threshold = 0.5 ################################################################ ###################### Table Data ############################## ################################################################ metrics_index = [ "AUC", "Accuracy", "Kappa", "Sensitivity (Recall)", "Specificity", "Precision", "F1", ] algo_columns = ["Test-SVM+Naïve B", "RF"] table_data = { "AUC": [threshold * 0.8, threshold * 0.83], "Accuracy": [threshold * 0.85, threshold * 0.86], "Kappa": [threshold * 0.66, threshold * 0.69], "Sensitivity (Recall)": [threshold * 0.82, threshold * 0.83], "Specificity": [threshold * 0.78, threshold * 0.79], "Precision": [threshold * 0.78, threshold * 0.79], "F1": [threshold * 0.81, threshold * 0.82], } data = [i for i in table_data] table = pd.DataFrame( columns=algo_columns, index=metrics_index, data=[table_data[i] for i in metrics_index], ) # display(table) ################################################################ ######################## Body ################################ ################################################################ body = dbc.Container( [ dbc.Row( [ dbc.Col( [ html.H2("Slider + Manual entry test"), dcc.Slider( id="my-slider", min=0, max=1, step=0.01, marks={"0": "0", "0.5": "0.5", "1": "1"}, value=threshold, ), html.Div(id="update-table"), ] ), dbc.Col( [ html.Div( [ html.Div( dcc.Input( id="input-box", max=0, min=1, step=0.01, value=threshold, ) ), html.Div(id="slider-output-container"), ] ) ] ), ] ) ] ) app = dash.Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP]) app.layout = html.Div([body]) ############################################################## ######################## callbacks ########################### ############################################################## @app.callback( dash.dependencies.Output("slider-output-container", "children"), [dash.dependencies.Input("my-slider", "value")], ) def update_output(value): threshold = float(value) return threshold # call back for slider to update based on manual input @app.callback( dash.dependencies.Output(component_id="my-slider", component_property="value"), [dash.dependencies.Input("input-box", "value")], ) def update_output(value): threshold = float(value) return threshold # call back to update table @app.callback( dash.dependencies.Output("update-table", "children"), [dash.dependencies.Input("my-slider", "value")], ) def update_output(value): threshold = float(value) table_data = pd.DataFrame.from_dict( { "AUC": [threshold * 0.8, threshold * 0.83], "Accuracy": [threshold * 0.85, threshold * 0.86], "Kappa": [threshold * 0.66, threshold * 0.69], "Sensitivity (Recall)": [threshold * 0.82, threshold * 0.83], "Specificity": [threshold * 0.78, threshold * 0.79], "Precision": [threshold * 0.78, threshold * 0.79], "F1": [threshold * 0.81, threshold * 0.82], } ) return html.Div( [ dash_table.DataTable( data=table_data.to_dict("rows"), columns=[{"id": x, "name": x} for x in table_data.columns], ) ] ) if __name__ == "__main__": app.run_server(host="0.0.0.0", port=8050, debug=True, dev_tools_hot_reload=True) 转换为数据框(这使table_data方法是pd.DataFrame方法有效!)
.to_dict()
  1. 也在 table_data = pd.DataFrame.from_dict( { "AUC": [threshold * 0.8, threshold * 0.83], "Accuracy": [threshold * 0.85, threshold * 0.86], "Kappa": [threshold * 0.66, threshold * 0.69], "Sensitivity (Recall)": [threshold * 0.82, threshold * 0.83], "Specificity": [threshold * 0.78, threshold * 0.79], "Precision": [threshold * 0.78, threshold * 0.79], "F1": [threshold * 0.81, threshold * 0.82], } ) 回调fxn中:

    • A。将df .to_dict方法调用
    • 的“记录”更改为“行”
    • B。您使用table而不是table_data作为列参数
    • C。在这里删除update_output Dash参数的使用,因为它已经在布局中了
id
  1. 好像您已切换了最大和最小! (最大为零不会留下很多可能的输入![实际上,没有..]);放置小数点和匹配精度也很重要,以防万一。
    return html.Div(
        [
            dash_table.DataTable(
                data=table_data.to_dict("rows"),
                columns=[{"id": x, "name": x} for x in table_data.columns],
            )
        ]
    )