Initial tab with contents as children


#1

When using “Method 2” as specified here: https://dash.plot.ly/dash-core-components/tabs is there a way to specify which tab should be selected initially?

Thanks.


#2

You can specify “value”, as shown in https://dash.plot.ly/dash-core-components/tabs
For example the code below shows tab-2 initially.

app.layout = html.Div([
    dcc.Tabs(id="tabs", value='tab-2-example', children=[
        dcc.Tab(label='Tab one', children=[
            html.Div([
                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'},
                        ]
                    }
                )
            ])
        ]),
        dcc.Tab(label='Tab two', value='tab-2-example', children=[
                dcc.Graph(
                    id='example-graph-1',
                    figure={
                        'data': [
                            {'x': [1, 2, 3], 'y': [1, 4, 1],
                                'type': 'bar', 'name': 'SF'},
                            {'x': [1, 2, 3], 'y': [1, 2, 3],
                             'type': 'bar', 'name': u'Montréal'},
                        ]
                    }
                )
        ]),
        dcc.Tab(label='Tab three', children=[
                dcc.Graph(
                    id='example-graph-2',
                    figure={
                        'data': [
                            {'x': [1, 2, 3], 'y': [2, 4, 3],
                                'type': 'bar', 'name': 'SF'},
                            {'x': [1, 2, 3], 'y': [5, 4, 3],
                             'type': 'bar', 'name': u'Montréal'},
                        ]
                    }
                )
        ]),
    ])
])


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

#3

I see, thanks! Would be great to clarify that in the example.


#4

It’s already mentioned in that link. I didn’t know the solution until I read the page.