Python dash_core_components.Tabs() Examples

The following are 3 code examples of dash_core_components.Tabs(). You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may also want to check out all available functions/classes of the module dash_core_components , or try the search function .
Example #1
Source File: dash-dynamic-tabs.py    From dash-recipes with MIT License 5 votes vote down vote up
def display_content(n_clicks):
    if n_clicks == 0:
        return ''
    now = datetime.datetime.now()
    return html.Div([
        dcc.Tabs(
            tabs=[
                {
                    'label': 'Tab {}'.format(i),
                    'value': 'tab-{}'.format(i)
                } for i in [1, 2, 3]
            ],
            value='tab-1',
            id='tabs'
        ),
        html.Div(
            id='tab-1',
            style={'display': 'block'},
            children='Tab 1 at {}'.format(now)
        ),
        html.Div(
            id='tab-2',
            style={'display': 'none'},
            children='Tab 2 at {}'.format(now)
        ),
        html.Div(
            id='tab-3',
            style={'display': 'none'},
            children='Tab 3 at {}'.format(now)
        )
    ]) 
Example #2
Source File: layout.py    From dtale with GNU Lesser General Public License v2.1 5 votes vote down vote up
def build_map_type_tabs(map_type):
    def _build_hoverable():
        for t in MAP_TYPES:
            if t.get("image", False):
                yield html.Div(
                    [
                        html.Span(t.get("label", t["value"].capitalize())),
                        html.Img(src=build_img_src(t["value"], img_type="map_type")),
                    ],
                    className="col-md-6",
                )

    return html.Div(
        [
            dcc.Tabs(
                id="map-type-tabs",
                value=map_type or "choropleth",
                children=[
                    build_tab(t.get("label", t["value"].capitalize()), t["value"])
                    for t in MAP_TYPES
                ],
                style=dict(height="36px"),
            ),
            html.Div(
                html.Div(list(_build_hoverable()), className="row"),
                className="hoverable__content map-types",
            ),
        ],
        style=dict(paddingLeft=15, borderBottom="none", width="20em"),
        className="hoverable",
    ) 
Example #3
Source File: app.py    From dash-bio with MIT License 3 votes vote down vote up
def layout():
    return html.Div(id='ideogram-body', className='app-body', children=[
        dcc.Loading(className='dashbio-loading', children=html.Div(id='ideogram-container')),
        html.Div(className='control-tabs', children=[
            dcc.Tabs(id='ideogram-control-tabs', value='what-is', children=[
                dcc.Tab(
                    label='About',
                    value='what-is',
                    children=html.Div(className='control-tab', children=[
                        html.H4(className='what-is', children='What is Ideogram?'),
                        html.P('Ideogram is a tool used to schematically '
                               'represent chromosomes. Bands on the chromosomes '
                               'can show the locations of specific genes.'),
                        html.P('In the "View" tab, you can choose to interact '
                               'with several different features of the Ideogram '
                               'component. You can customize the appearance of '
                               'the ideogram, as well as choose a different '
                               'organism to display, under the "Custom" option. '
                               'The homology, brush, and annotation features '
                               'are demonstrated under the corresponding options.')
                    ])
                ),
                dcc.Tab(
                    label='View',
                    value='view',
                    children=html.Div(className='control-tab', children=[
                        html.Div(id='ideogram-feature-select', children=[
                            html.Div(className='app-controls-block', children=[
                                html.Div(
                                    className='app-controls-name',
                                    children='View feature:'
                                ),
                                dcc.Dropdown(
                                    className='ideogram-dropdown',
                                    id='ideogram-feature-dropdown',
                                    options=[
                                        {'label': 'Customizability', 'value': 'custom'},
                                        {'label': 'Homology', 'value': 'homology'},
                                        {'label': 'Brush', 'value': 'brush'},
                                        {'label': 'Annotations', 'value': 'annotations'}
                                    ],
                                    clearable=False,
                                    value='custom'
                                )
                            ]),
                        ]),
                        html.Hr(),
                        html.Div(
                            id='ideogram-feature-view-options'
                        )
                    ])
                )
            ])
        ]),
        dcc.Store(id='ideo-custom-data', data=ideograms_initial['custom']),
        dcc.Store(id='ideo-homology-data', data=ideograms_initial['homology']),
        dcc.Store(id='brush-ideo-data', data=ideograms_initial['brush']),
        dcc.Store(id='ideo-annotations-data', data=ideograms_initial['annotations'])
    ])