破折号：app.layout外部的非回调图

Question

我试图在app.layout声明之外放置一个非回调图（即将显示固定图像的图），因为最后一页将包含许多图，并且我想将代码与可视化分开。使用dash.dependencies.Output捕获命名div中的图形，但显示空白：

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
from dash.dependencies import Output

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

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

app.layout = html.Div(
        [
            html.H1('Hello Dash'),

            html.Div(
                ''' Dash: A web application framework for Python.'''
            ),

            html.Div(
            [
                # Column: Graph
                html.Div(
                    [
                        dcc.Graph(id='fignocallback')
                    ],
                    className="col-md-10"
                )
            ],
            className="col-md-12"
            )
        ]
)

@app.callback(
    Output('fignocallback', 'figure'))
def displayfig():
    trace1 = go.Bar(x=[1, 2, 3, 4], y=[10, 20, 30, 40], name='testfig', yaxis='y')
    data = [trace1]
    figure = {
        'data': data,

        'layout': go.Layout(
            title='Test',
            yaxis=dict(
                title='Test Figure'
            ),
            width=600,
            height=400,
        )
    }
    return figure


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

谢谢