Python dash_core_components.Dropdown() Examples

def serve_layout():
    return html.Div(
        [
            dcc.Interval(interval=5 * 1000, id="interval"),
            html.H1("Redis, Celery, and Periodic Updates"),
            html.Div(id="status"),
            dcc.Dropdown(
                id="dropdown",
                options=[{"value": i, "label": i} for i in ["LA", "NYC", "MTL"]],
                value="LA",
            ),
            dcc.Graph(id="graph"),
        ]
    ) 

def surface_names_layout(self):
        return html.Div(
            style=self.set_style(marginTop="20px"),
            children=html.Label(
                children=[
                    html.Span("Surface:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("surfacenames"),
                        options=[
                            {"label": name, "value": name} for name in self.surfacenames
                        ],
                        value=self.surfacenames,
                        clearable=True,
                        multi=True,
                    ),
                ]
            ),
        ) 

def well_layout(self):
        return html.Div(
            children=html.Label(
                children=[
                    html.Span("Well:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("wells"),
                        options=[
                            {"label": Path(well).stem, "value": well}
                            for well in self.wellfiles
                        ],
                        value=self.wellfiles[0],
                        clearable=False,
                    ),
                ]
            )
        ) 

def smry_selector(self):
        """Dropdown to select ensemble"""
        return html.Div(
            style={"paddingBottom": "30px"},
            children=html.Label(
                children=[
                    html.Span("Time series:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("vector"),
                        options=[
                            {
                                "label": f"{simulation_vector_description(vec)} ({vec})",
                                "value": vec,
                            }
                            for vec in self.smry_cols
                        ],
                        clearable=False,
                        value=self.initial_vector,
                    ),
                ]
            ),
        ) 

def ensemble_selector(self):
        """Dropdown to select ensemble"""
        return html.Div(
            style={"paddingBottom": "30px"},
            children=html.Label(
                children=[
                    html.Span("Ensemble:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("ensemble"),
                        options=[
                            {"label": i, "value": i}
                            for i in list(self.data["ENSEMBLE"].unique())
                        ],
                        clearable=False,
                        value=list(self.data["ENSEMBLE"].unique())[0],
                    ),
                ]
            ),
        ) 

def well_layout(self):
        return html.Div(
            children=html.Label(
                children=[
                    html.Span("Well:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("wells"),
                        options=[
                            {"label": Path(well).stem, "value": well}
                            for well in self.wellfiles
                        ],
                        value=self.wellfiles[0],
                        clearable=False,
                    ),
                ]
            ),
        ) 

def seismic_layout(self):
        return html.Div(
            style={} if self.segyfiles else {"display": "none"},
            children=html.Label(
                children=[
                    html.Span("Seismic:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("cube"),
                        options=[
                            {"label": Path(segy).stem, "value": segy}
                            for segy in self.segyfiles
                        ]
                        if self.segyfiles
                        else None,
                        value=self.segyfiles[0] if self.segyfiles else None,
                        clearable=False,
                    ),
                ]
            ),
        ) 

def response_selector(self):
        """Dropdown to select volumetric response"""
        return html.Div(
            children=html.Label(
                children=[
                    html.Span("Volumetric calculation:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.uuid("response"),
                        options=[
                            {"label": volume_description(i), "value": i}
                            for i in self.responses
                        ],
                        clearable=False,
                        value=self.initial_response
                        if self.initial_response in self.responses
                        else self.responses[0],
                    ),
                ]
            ),
        ) 

def plot_selector(self):
        """Radiobuttons to select plot type"""
        return html.Div(
            children=[
                html.Span("Plot type:", style={"font-weight": "bold"}),
                dcc.Dropdown(
                    id=self.uuid("plot-type"),
                    options=[
                        {"label": i, "value": i}
                        for i in [
                            "Per realization",
                            "Per sensitivity name",
                            "Per sensitivity case",
                        ]
                    ],
                    value="Per realization",
                    clearable=False,
                ),
            ]
        ) 

def selector(self, label, id_name, column):
        return html.Div(
            children=html.Label(
                children=[
                    html.Span(f"{label}:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.uuid(id_name),
                        options=[
                            {"label": i, "value": i}
                            for i in list(self.volumes[column].unique())
                        ],
                        clearable=False,
                        value=list(self.volumes[column])[0],
                    ),
                ]
            ),
        ) 

def marginal_log_layout(self):
        if self.marginal_logs is not None:
            return html.Div(
                children=html.Label(
                    children=[
                        html.Span("Marginal log:", style={"font-weight": "bold"}),
                        dcc.Dropdown(
                            id=self.ids("marginal-log"),
                            options=[
                                {"label": log, "value": log}
                                for log in self.marginal_logs
                            ],
                            placeholder="Display log",
                            clearable=True,
                        ),
                    ]
                ),
            )
        return html.Div(
            style={"visibility": "hidden"},
            children=dcc.Dropdown(id=self.ids("marginal-log")),
        ) 

def ensemble_layout(self):
        return html.Div(
            style=self.set_style(marginTop="20px"),
            children=html.Label(
                children=[
                    html.Span("Ensemble:", style={"font-weight": "bold"}),
                    dcc.Dropdown(
                        id=self.ids("ensembles"),
                        options=[
                            {"label": ens, "value": ens}
                            for ens in self.ensembles.keys()
                        ],
                        value=list(self.ensembles.keys())[0],
                        clearable=False,
                        multi=False,
                    ),
                ]
            ),
        ) 

def selector(title, trace, varname, include_transformed_chooser=True):
    children = [
        html.Label("Variable"),
        dcc.Dropdown(
            id='{}-selector'.format(title),
            options=get_varname_options(trace),
            value=varname
        )
    ]

    if include_transformed_chooser: 
        children.append(
            dcc.Checklist(
                id='{}-selector-include-transformed'.format(title),
                options=[{
                    'label': "Include transformed variables",
                    'value': 'include_transformed'
                }],
                values=[]
            )
        )

    return html.Div(children, style={'width': '20%'}) 

def attribute_selector(self):
        return html.Div(
            style={"display": "grid"},
            children=[
                html.Label("Surface attribute"),
                html.Div(
                    style=self.set_grid_layout("6fr 1fr"),
                    children=[
                        dcc.Dropdown(
                            id=self.attr_id,
                            options=[
                                {"label": attr, "value": attr} for attr in self.attrs
                            ],
                            value=self.attrs[0],
                            clearable=False,
                        ),
                        self._make_buttons(
                            self.attr_id_btn_prev, self.attr_id_btn_next
                        ),
                    ],
                ),
            ],
        ) 

def display_dropdowns(n_clicks, children):
    new_element = html.Div([
        dcc.Dropdown(
            id={
                'type': 'dynamic-dropdown',
                'index': n_clicks
            },
            options=[{'label': i, 'value': i} for i in ['NYC', 'MTL', 'LA', 'TOKYO']]
        ),
        html.Div(
            id={
                'type': 'dynamic-output',
                'index': n_clicks
            }
        )
    ])
    children.append(new_element)
    return children 

def display_dropdowns(n_clicks, existing_children):
    existing_children.append(html.Div([
        dcc.Dropdown(
            id={
                'type': 'filter-dropdown-ex3',
                'index': n_clicks
            },
            options=[{'label': i, 'value': i} for i in df['country'].unique()],
            value=df['country'].unique()[n_clicks]
        ),
        html.Div(id={
            'type': 'output-ex3',
            'index': n_clicks
        })
    ]))
    return existing_children 

def filter_layout(self):
        """Layout to display selectors for response filters"""
        children = []
        for col_name, col_type in self.response_filters.items():
            domid = self.ids(f"filter-{col_name}")
            values = list(self.responsedf[col_name].unique())
            if col_type == "multi":
                selector = wcc.Select(
                    id=domid,
                    options=[{"label": val, "value": val} for val in values],
                    value=values,
                    multi=True,
                    size=min(20, len(values)),
                )
            elif col_type == "single":
                selector = dcc.Dropdown(
                    id=domid,
                    options=[{"label": val, "value": val} for val in values],
                    value=values[0],
                    multi=False,
                    clearable=False,
                )
            elif col_type == "range":
                selector = make_range_slider(domid, self.responsedf[col_name], col_name)
            else:
                return children
            children.append(html.Div(children=[html.Label(col_name), selector,]))

        return children 

def set_neighborhood(city):
    neighborhoods = NEIGHBORHOODS[city]
    return dcc.Dropdown(
        id='neighborhood',
        value=neighborhoods[0],
        options=[{'label': v, 'value': v} for v in neighborhoods],
        persistence_type='session',
        persistence=city
    ) 

def dropdown_from_dict(dom_id, dictionary):
        return dcc.Dropdown(
            id=dom_id,
            options=[{"label": k, "value": v} for k, v in dictionary.items()],
            value=list(dictionary.values())[0],
            clearable=False,
        ) 

def display_output(value, id):
    return html.Div('Dropdown {} = {}'.format(id['index'], value)) 

def display_dropdowns(n_clicks, children):
    new_dropdown = dcc.Dropdown(
        id={
            'type': 'filter-dropdown',
            'index': n_clicks
        },
        options=[{'label': i, 'value': i} for i in ['NYC', 'MTL', 'LA', 'TOKYO']]
    )
    children.append(new_dropdown)
    return children 

def size_color_layout(self):
        return [
            html.Div(
                children=[
                    html.Label(style={"font-weight": "bold"}, children="Color by",),
                    dcc.Dropdown(
                        id=self.uuid("crossplot_color"),
                        options=[
                            {"label": "Misfit", "value": "ABSDIFF",},
                            {"label": "Standard Deviation", "value": "STDDEV",},
                        ],
                        value="STDDEV",
                        clearable=False,
                    ),
                ],
            ),
            html.Div(
                children=[
                    html.Label(style={"font-weight": "bold"}, children="Size by",),
                    dcc.Dropdown(
                        id=self.uuid("crossplot_size"),
                        options=[
                            {"label": "Standard Deviation", "value": "STDDEV",},
                            {"label": "Misfit", "value": "ABSDIFF",},
                        ],
                        value="ABSDIFF",
                        clearable=False,
                    ),
                ],
            ),
        ] 

def NamedDropdown(name, **kwargs):
    return html.Div([
        html.P(f'{name}:', style={'margin-left': '3px'}),
        dcc.Dropdown(**kwargs)
    ]) 

def CustomDropdown(**kwargs):
    return html.Div(
        dcc.Dropdown(**kwargs),
        style={'margin-top': '5px', 'margin-bottom': '5px'}
    ) 

def NamedDropdown(name, **kwargs):
    return html.Div(
        style={'margin': '10px 0px'},
        children=[
            html.P(
                children=f'{name}:',
                style={'margin-left': '3px'}
            ),

            dcc.Dropdown(**kwargs)
        ]
    ) 

def NamedDropdown(name, **kwargs):
    return html.Div(
        style={'margin': '10px 0px'},
        children=[
            html.P(
                children=f'{name}:',
                style={'margin-left': '3px'}
            ),

            dcc.Dropdown(**kwargs)
        ]
    ) 

def serve_layout():
    return html.Div([
        html.Div(id='state-container'),
        dcc.Dropdown(id='dropdown', options=[{'label': i, 'value': i} for i in ['A', 'B']]),
        dcc.Dropdown(id='output', options=[{}])
    ]) 

def __init__(self, parent_name, local_name):
        Component.__init__(self, parent_name, local_name)
        self.dropdown = Dropdown(parent_name, local_name, list(path_to_log.keys()),
                                 'Choose search logs to visualize.', True)
        self._register(
            full_column([
                Text(self.full_name, 'title', 'Search logs').get_layout(),
                self.dropdown.get_layout()
            ])) 

def __init__(self, parent_name, local_name,
                 dimension_selector_placeholder_text):
        Component.__init__(self, parent_name, local_name)
        self.dropdown = Dropdown(self.full_name, 'selector', list(ds[0].keys()),
                                 dimension_selector_placeholder_text, False)
        self.radio = RadioItems(self.full_name, 'scale', ['linear', 'log'],
                                True)
        self._register(
            two_thirds_one_third_column([self.dropdown.get_layout()],
                                        [self.radio.get_layout()])) 

def __init__(self, parent_name, local_name):
        Component.__init__(self, parent_name, local_name)
        # self.add_row_dropdown = Dropdown(self.full_name, 'add_row_dropdown',
        #     'Select row type.')
        self.add_row_button = Button(self.full_name, 'add_button', 'Add Row')
        # self.copy_row_dropdown = Dropdown(self.full_name, )
        self._register(
            full_column([
                # Text(self.full_name, 'title', 'Row').get_layout(),
                self.add_row_button.get_layout()
            ]))