Python dash 回调函数 [英] Python dash call back function

问题描述

这可能问了很多，但我很好奇是否有人有任何关于组合这两个破折号脚本的提示.目的是合并下拉菜单以删除/添加可视化图上的数据点.

This maybe asking alot, but I was curious if anyone had any tips for combining these two dash scripts. The purpose would be to incorporate the drop down menu to remove/add data points on the visualization plots.

第一个脚本将很好地可视化我的数据，带有回调函数的第二个脚本用于从 情节教程.

The first script will visualize my data nicely and the second script with the callback function is for creating a drop down menu from the plotly tutorials.

import dash
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
import plotly.graph_objs as go


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

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



df = pd.read_csv('boilerData.csv', index_col='Date', parse_dates=True)
df = df.fillna(method = 'ffill').fillna(method = 'bfill')




app.layout = html.Div([
    dcc.Graph(
        id='hws',
        figure={
            'data': [
                {'x': df.index, 'y': df.HWST, 'type': 'line', 'name': 'hwst'},
                {'x': df.index, 'y': df.HWRT, 'type': 'line', 'name': 'hwrt'},
                {'x': df.index, 'y': df.OAT, 'type': 'line', 'name': 'oat'},
            ],
            'layout': {
                'title': 'Heating System Data Visualization'
            }
        }
    )
])

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

下拉脚本:

import dash
import dash_html_components as html
import dash_core_components as dcc

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

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
app.layout = html.Div([
    dcc.Dropdown(
        id='my-dropdown',
        options=[
            {'label': 'Outdoor Temp', 'value': 'OAT'},
            {'label': 'Hot Water Supply Temp', 'value': 'HWST'},
            {'label': 'Hot Water Return Temp', 'value': 'HWRT'}
        ],
        value=['OAT','HWST','HWRT'],
        multi=True
    ),
    html.Div(id='output-container')
])


@app.callback(
    dash.dependencies.Output('output-container', 'children'),
    [dash.dependencies.Input('my-dropdown', 'value')])
def update_output(value):
    return 'You have selected "{}"'.format(value)


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

任何提示都有帮助，仍在学习中...

Any tips help, still learning...

推荐答案

你需要知道的是回调从一些 Dash 元素(这里是 value下拉菜单)并返回到 Output 以获取另一个 Dash 元素的某些属性(这里是图中的 figure；注意我们只更改了 data财产).

What you need to know is that the callback takes Input from some Dash element (here the value of the dropdown) and returns to Output for some property of another Dash element (here the figure from the graph; notice we only change the data property).

import dash
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
import plotly.graph_objs as go
import numpy as np

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

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



df = pd.read_csv('boilerData.csv', index_col='Date', parse_dates=True)
df = df.fillna(method = 'ffill').fillna(method = 'bfill')

app.layout = html.Div([

    dcc.Dropdown(
        id='my-dropdown',
        options=[
            {'label': 'Outdoor Temp', 'value': 'OAT'},
            {'label': 'Hot Water Supply Temp', 'value': 'HWST'},
            {'label': 'Hot Water Return Temp', 'value': 'HWRT'}
        ],
        value=['OAT','HWST','HWRT'],
        multi=True
    ),

    dcc.Graph(
        id='hws',
        figure={
            'data': [
                {'x': df.index, 'y': df.HWST, 'type': 'line', 'name': 'hwst'},
                {'x': df.index, 'y': df.HWRT, 'type': 'line', 'name': 'hwrt'},
                {'x': df.index, 'y': df.OAT, 'type': 'line', 'name': 'oat'},
            ],
            'layout': {
                'title': 'Heating System Data Visualization'
            }
        }
    )
])


@app.callback(
    dash.dependencies.Output('hws', 'figure'),
    [dash.dependencies.Input('my-dropdown', 'value')])
def update_output(columns):
    return {"data": [{'x': df.index, 'y': df[col], 'type':'line', 'name': col}
                     for col in columns]}


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

这篇关于Python dash 回调函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！