python - 使用 Dash for Figure 作为无效参数 `figure.layout` 传递给 Graph 时出现错误，预期为 `object` 。提供类型 `array`

Question

我正在尝试使用破折号绘制一些数据的代码，我在想，我做对了。但不确定为什么会收到一条非常奇特的消息(plotly 3.8.1 and dash 0.42)

我得到的错误信息是:

Invalid argument figure.layout passed into Graph with ID “graph-with-slider”. Expected object. Was supplied type array.

我创建了一个工作正常并提供数据的输出，问题出在布局和图形调用中。我不明白。

 external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
#
app = dash.Dash(__name__, external_stylesheets = external_stylesheets)
server = app.server

app.config['suppress_callback_exceptions'] = True
app.css.config.serve_locally = True
app.scripts.config.serve_locally = True

#
app.layout = html.Div([
        html.Div([
            html.H1('Testing Phase', style = {'text-align': 'center'}),


                html.H5('Enter ID'),
                dcc.Dropdown(
                    id = 'id',
                    style = {'width': '250px'},
                    options = [
                        {'label': 'AA', 'value': 'AA'},
                        {'label': 'AC', 'value': 'AC'},
                        {'label': 'UQ', 'value': 'UQ'},
                        {'label': 'NT', 'value': 'NT'},
                        {'label': 'PQ', 'value': 'PQ'}],
                    value = 'AA'
                ),

                html.H5('Enter Zone Yield Item'),
                dcc.Dropdown(
                    id = 'mz',
                    style = {'width': '200px'},
                    options = [
                        {'label': 'E1', 'value': 'E1'},
                        {'label': 'E2', 'value': 'E2'},
                        {'label': 'E3', 'value': 'E3'},
                        {'label': 'E4', 'value': 'E4'},
                        {'label': 'E5', 'value': 'E5'},
                        {'label': 'E6', 'value': 'E6'}],
                    value = 'E1'
                ),
    

                html.Br(),
                html.Br(),

                html.Button(
                    id = 'submit',
                    n_clicks = 0,
                    children = 'Submit'

                ),

                html.Br(),
                html.Br(),

                   html.Div([

                    dcc.Graph(
                        id='mygraph'
                    ),

                ]),

                html.Br(),
                html.Br(),

            ])
        ])

    ])

@app.callback(Output('mygraph', 'figure'),
                       [Input('submit', 'n_clicks')],
                       [State('pid', 'value'), State('mz', 'value')])])
def update_figure(n_clicks, pid, zone):

        mydf = SomeFuncFunc(id, zone)

        fit_data = mydf[0]

        l_col = fit_data.columns[2]

        z_col = fit_data.columns[3]  

        z2_col = fit_data.columns[4]

        l1_v = str(l_col)
        z1_v = str(z_col)


        print("Starting Trace")

        fits = []

        fits.append(go.Scatter(
            x = fit_data[l_col],
            y = fit_data[z_col],
            mode = 'markers',
            opacity = 0.9,
            marker = {
                'size': 20, 'symbol': "hexagon", "color": "orange",
                'line': {'width': 0.5, 'color': 'white'}
            },
            name = z1_v + "_" + "Plot",
        )),

        fits.append(go.Scatter(
             x = fit_data[l_col],
             y = fit_data[z2_col],
            mode = 'markers',
            opacity = 0.9,
            marker = {
                'size': 20, 'symbol': "diamond-open-dot", "color": "blue",
                'line': {'width': 0.9, 'color': 'red'}
            },
            name = z1_v + "_" + "Fit",
        )),

        mylayout = go.Layout(
             width = 800,
             height = 500,
            xaxis = {'title': 'X axis'},
            yaxis = {'title': 'Y axis'}
            margin={'l': 40, 'b': 40, 't': 10, 'r': 10},
            legend = {'x': 0, 'y': 1},
            hovermode = 'closest'
        ),
        fig = {'data':  fits, 'layout':mylayout}

        return fig



 if __name__ == '__main__':

      app.run_server(debug = True, port=8053)  #

它应该绘制数据。如果我不包括布局，它就是绘图，但并非总是如此。

错误详情:

(This error originated from the built-in JavaScript code that runs Dash apps. Click to see the full stack trace or open your browser's console.)Error: Invalid argument `figure.layout` passed into Graph with ID "graphid".
Expected `object`.
Was supplied type `array`.
   at propTypeErrorHandler (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/dash_renderer.dev.js?v=0.23.0&m=1557158783:40947:5)

   at CheckedComponent (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/dash_renderer.dev.js?v=0.23.0&m=1557158783:37306:9)

   at Td (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:82:9)

   at be (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:91:477)

   at hi (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:104:140)

   at Qg (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:144:287)

   at Rg (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:145:166)

   at Sc (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:158:109)

   at Z (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:156:492)

   at Kc (http://127.0.0.1:8053/_dash-component-suites/dash_renderer/react-dom@16.8.6.min.js?v=0.23.0&m=1557158783:155:69)

Answer 1

认为问题是由于布局末尾的逗号导致图形布局被视为数组而不是对象。现在工作正常。