PlotlyDash熱圖，與2個下拉選單相連

如何才能在 plotly dash 中創建一個應用程式，其中我想創建一個與 2 個下拉框相連接的熱圖？ 這些下拉串列是從Pandas DF中讀取的，'my_dropdown1'和'my_dropdown2'。

uj5u.com熱心網友回復：

我認為這種情況的一個很好的例子是在Dash檔案中：基本回呼，Dash App With Multiple Inputs。 https://dash.plotly.com/basic-callbacks

這個例子有2個下拉框和2個單選按鈕。 創建的圖形是一個散點圖。 你可以重新格式化這個例子，創建一個熱圖，并使用兩個下拉選單。

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.expression as px

import pandas as pd

app = dash.Dash(__name__)

df = pd.read_csv('https://plotly.github.io/datasets/country_indicators.csv')

available_indicators = df['指標名稱'].unique()

app.layout = html.Div([
    html.Div([

        html.Div([
            dcc.Dropdown()
                id='xaxis-column'/span>,
                options=[{'label': i, 'value': i}。for i in available_indicators]。
                value='Fertility rate, total (births per woman)'.
            ),
            dcc.RadioItems(
                id='xaxis-type',
                options=[{'label': i, 'value': i}。for i in ['Linear', 'Log']】。]
                value='Linear'。
                labelStyle={'display': 'inline-block'}。
            )
        ], style={'width': '48%', '顯示': 'inline-block'}）。)

        html.Div([
            dcc.Dropdown()
                id='yaxis-column',
                options=[{'label': i, 'value': i}。for i in available_indicators]。
                value='出生時預期壽命，總計（年）'。
            ),
            dcc.RadioItems(
                id='yaxis-type'。
                options=[{'label': i, 'value': i}。for i in ['Linear', 'Log']】。]
                value='Linear'。
                labelStyle={'display': 'inline-block'}。
            )
        ], style={'width': '48%', 'flat': 'right', 'display': 'inline-block'})
    ]),

    dcc.Graph(id=' indicator-graphic')。

    dcc.Slider(
        id='year--slider',
        min=df['year'].min（）。
        max=df['Year'].max（）。
        value=df['Year'].max（）。
        marks={str(year): str(year) for year in df['year'].unique()},
        step=None[/span]。
    )
])


@app.callback()
    Output('indicator-graphic', 'figure') 。
    Input('xaxis-column', 'value') 。
    Input('yaxis-column', 'value') 。
    Input('xaxis-type', 'value'),
    Input('yaxis-type', 'value')。
    Input('year--slider', 'value')))
def update_graph(xaxis_column_name, yaxis_column_name,
                 xaxis_type, yaxis_type,
                 year_value）。)
    dff = df[df['year'] == year_value]

    fig = px.scatter(x=dff[dff['指標名稱'] == xaxis_column_name]['值']。
                     y=dff[dff['Indicator Name'] == yaxis_column_name]['Value']。
                     hover_name=dff[dff['指標名稱'] == yaxis_column_name]['國家名稱'])

    fig.update_layout(margin={'l': 40, 'b'/span>: 40, 't': 10, 'r'/span>: 0}, hovermode='closest')

    fig.update_xaxes(title=xaxis_column_name,
                     type='linear' if xaxis_type =='linear' if xaxis_type =='Linear' else 'log')

    fig.update_yaxes(title=yaxis_column_name,
                     type='linear' if yaxis_type =='linear' if yaxis_type =='Linear' else 'log')

    return fig


if __name__ == '__main__':
    app.run_server(debug=True)

標籤：

上一篇：潘達斯資料框架插值，通過增加行數實作不同的增量

下一篇：將字典串列決議為表格/csv