How to show 2 graphs on 1 page

[bainadeashish]

I have written 2 DIV like below

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

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

dcc.Graph(
    id='example-graph',
    figure={
        'data': [
            {'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
            {'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': u'Montréal'},
        ],
        'layout': {
            'title': 'Dash Data Visualization'
        }
    }
)

])

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

html.Div(children='''
    Dash1: A web application framework for Python.
'''),

dcc.Graph(
    id='example-graph1',
    figure={
        'data': [
            {'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
            {'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': u'Montréal'},
        ],
        'layout': {
            'title': 'Dash Data Visualization'
        }
    }
)

])

But In output I am seeing only 1 DIV the latter one.How to show them as a Dashboards having multiple graphs on same url?

[chriddyp]

Hi @bainadeashish - Your app can only have a single app.layout. You'll need something like:

app.layout = html.Div([
    html.Div(...),
    html.Graph(...),
    html.Div(...),
    html.Graph(...),
])

There are some examples of multiple graphs towards the end of the second chapter of the user guide: https://plot.ly/dash/getting-started-part-2

Also see the community forum to get more help on implementation questions like these: https://community.plot.ly/c/dash