Plotly Dash：在输出中显示变量值答案

【问题标题】：Plotly Dash：在输出中显示变量值
【发布时间】：2020-08-08 21:26:23
【问题描述】：

我正在尝试使用此处提供的 COVID-19 数据集制作带有 plotly Dash 的仪表板：https://github.com/RamiKrispin/coronavirus-csv

现在，我想显示通过下拉菜单选择的国家/地区的摘要。但是，我不知道如何只显示变量值。

我为这样的总摘要做了这个： Summary using just HTML

html.Div([html.H1('Summary'),

                              html.Div([html.H2('Confirmed'), 
                                        html.H2(t_confirmed)
                                       ], style = {'width': '30%','display': 'inline-block', 'border':'2px solid black', 'text-align' : 'center', 'font-family': 'Century Gothic'}),
                              html.Div([html.H2('Recovered'), 
                                        html.H2(t_recovered)
                                       ], style = {'width': '30%','display': 'inline-block', 'border':'2px solid black', 'text-align' : 'center', 'font-family': 'Century Gothic'}),
                              html.Div([html.H2('Deaths'), 
                                        html.H2(t_deaths)
                                       ], style = {'width': '30%','display': 'inline-block', 'border':'2px solid black', 'text-align' : 'center', 'font-family': 'Century Gothic'}),

                             ], style = {'width': '50%','display': 'inline-block', 'vertical-align' : 'top', 'font-family' : 'Century Gothic'})

我想要的是，值应根据所选国家/地区而变化。我有根据国家/地区将这些值返回给我的代码和函数。不知道如何显示它们。任何帮助将不胜感激！

【问题讨论】：

标签： python data-visualization dashboard plotly-dash

【解决方案1】：

听起来你需要的是Dash Callbacks。这些允许您在与组件交互时动态更改组件的外观。向下滚动并查看“多个输出”部分 - 这可能与您尝试做的类似。希望对您有所帮助。

【讨论】：

您好，感谢您的回复。我想要的是，例如，当我们输入 print("Total death:", ) 并打印 Total death: 1000. 我知道如何以破折号输出图表。 dcc.Graph(id = 'some_name', figure = fig_name) 同样，我用什么输出变量值是我的问题。我希望它现在有点清楚了！

【解决方案2】：

您可以为包含各种数字的html.H2() 组件分配一个ID，然后在回调中更新它们的内容（即它们的children 属性）（同样由Swazy 建议）：

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

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

server = app.server

app.layout = html.Div(children=[

    dcc.Dropdown(id='countries',
                 options=[{'label': 'Country 1', 'value': 'country_1'},
                          {'label': 'Country 2', 'value': 'country_2'}],
                 value='country_1',
                 multi=False),

    html.Div(children=[

        html.H1('Summary'),

        html.Div(children=[html.H2('Confirmed'), html.H2(id='confirmed')],
                 style={'width': '30%', 'display': 'inline-block', 'border': '2px solid black', 'text-align': 'center', 'font-family': 'Century Gothic'}),

        html.Div(children=[html.H2('Recovered'), html.H2(id='recovered')],
                 style={'width': '30%', 'display': 'inline-block', 'border': '2px solid black', 'text-align': 'center', 'font-family': 'Century Gothic'}),

        html.Div(children=[html.H2('Deaths'),html.H2(id='deaths')],
                 style={'width': '30%','display': 'inline-block', 'border': '2px solid black', 'text-align': 'center', 'font-family': 'Century Gothic'}),

    ], style={'width': '50%','display': 'inline-block', 'vertical-align' : 'top', 'font-family' : 'Century Gothic'})

])

@app.callback([Output('confirmed', 'children'), Output('recovered', 'children'),
               Output('deaths', 'children')], [Input('countries', 'value')])
def update_summary(country):

    if country == 'country_1':

        return [1000, 2000, 3000]

    else:

        return [4000, 5000, 6000]

if __name__ == '__main__':
    app.run_server(debug=False, host='127.0.0.1')

【讨论】：