python中的破折号-关于散点图和下拉列表的回调错误答案

【问题标题】：Dash in python - callback error about scatter plot and dropdownpython中的破折号-关于散点图和下拉列表的回调错误
【发布时间】：2020-10-24 16:31:00
【问题描述】：

我正在学习 dash 库。当我在数据框中选择列时，此代码显示散点图。这样可以正常工作，但是网页上出现回调错误。

在网络上，回调错误更新 spas-graph.figure 我不明白为什么会发生这个错误。

[import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objects as go
import pandas as pd

df = pd.DataFrame({
    'depth' : [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
    'upper_value' : [1, 4, 6, 2, 6, 8, 9, 10, 4, 2],
    'middle_value' : [5, 3, 7, 8, 1, 2, 3, 1, 4, 8],
    'down_value' : [6, 2, 1, 10, 5, 2, 3, 4, 2, 7]
})

col_list = df.columns[1:4]

app = dash.Dash(__name__)

app.layout = html.Div([

    dcc.Dropdown(
        id = 'select-cd',
        options = [
            {'label' : i, 'value' : i}
            for i in col_list
        ]
    ),

    dcc.Graph(id = 'spas-graph')    

])

@app.callback(
    Output('spas-graph', 'figure'),
    [Input('select-cd', 'value')]
)
def update_figure(selected_col):
   
    return {
        'data' : [go.Scatter(
            x = df[selected_col],
            y = df['depth'],
            mode = 'lines + markers',
            marker = {
                'size' : 15,
                'opacity' : 0.5,
                'line' : {'width' : 0.5, 'color' : 'white'}
            }
        )],
        
        'layout' : go.Layout(
            xaxis={'title': 'x_scale'},
            yaxis={'title': 'y_scale'},
            hovermode='closest'
        )
    }

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

【问题讨论】：

标签： python plotly-dash

【解决方案1】：

您尚未在下拉方法中定义 value 参数。因此，当服务器启动时，它接收的第一个输入是 None 值。

你可以通过两种方式解决：

在下拉列表中添加默认值：

在回调方法中处理 None 值

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

 df = pd.DataFrame({
     'depth' : [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
     'upper_value' : [1, 4, 6, 2, 6, 8, 9, 10, 4, 2],
     'middle_value' : [5, 3, 7, 8, 1, 2, 3, 1, 4, 8],
     'down_value' : [6, 2, 1, 10, 5, 2, 3, 4, 2, 7]
 })

 col_list = df.columns[1:4]

 app = dash.Dash(__name__)

 app.layout = html.Div([

     dcc.Dropdown(
         id = 'select-cd',
         options = [
             {'label' : i, 'value' : i}
             for i in col_list
         ],
         value = col_list[0]
     ),

     dcc.Graph(id = 'spas-graph')    

 ])

 @app.callback(
     Output('spas-graph', 'figure'),
     [Input('select-cd', 'value')]
 )
 def update_figure(selected_col):
     if selected_col is None:
         selected_col = col_list[0]
     return {
         'data' : [go.Scatter(
             x = df[selected_col],
             y = df['depth'],
             mode = 'lines + markers',
             marker = {
                 'size' : 15,
                 'opacity' : 0.5,
                 'line' : {'width' : 0.5, 'color' : 'white'}
             }
         )],

         'layout' : go.Layout(
             xaxis={'title': 'x_scale'},
             yaxis={'title': 'y_scale'},
             hovermode='closest'
         )
     }

【讨论】：