def init_dashboard(server): dash_app = dash.Dash( server=server, routes_pathname_prefix="/", external_stylesheets=[dbc.themes.SUPERHERO], ) dash_app.title = 'Covid-19 Dashboard' #lo Create Layout dash_app.layout = dbc.Container( [ html.H1("USA Covid-19 Dashboard"), html.P(children=['Last updated: ',last_update], style={'text-align': 'right'}), html.Hr(), dbc.Tabs( [ dbc.Tab(label="Overview", tab_id="tab-1"), dbc.Tab(label="Testing", tab_id="tab-3"), dbc.Tab(label="Hospitalizations", tab_id="tab-4"), dbc.Tab(label="Deaths", tab_id="tab-5"), dbc.Tab(label="Vaccination", tab_id="tab-2"), dbc.Tab(label="About", tab_id="tab-6"), ], id = 'tabs', active_tab = 'tab-1', ), html.Div(id="tab-content", className="p-4"), html.Br(), html.Div(id="drop_figure"), ] ) init_callbacks(dash_app) return dash_app.server
def client_tabbed_view(views): """ Create a tabbed view for a given list of views. The list Args: views (list): A list that contains dictionaries with keys for the view and the tab name. :: [ {'view': dash.development.base_component.Component(), 'tab_name': 'Tab name'} ] Returns: dash_bootstrap_components._components.Tabs.Tabs: """ tabs = dbc.Tabs( [ dbc.Tab( view["view"], label=view["tab_name"], tab_id=f"tab-{view['tab_name'].lower().replace(' ', '-')}", ) for view in views ], className="mt-5 mb-3", id="project-tabs", active_tab=f"tab-{views[0]['tab_name'].lower().replace(' ', '-')}", ) return tabs
def init_dashboard(flask_app): """Create a Plotly Dash dashboard.""" dash_app = dash.Dash(server=flask_app, routes_pathname_prefix="/dash_app/", external_stylesheets=[dbc.themes.LITERA], ) dash_app.layout = dbc.Container(fluid=True, children=[ html.Br(), html.H1('Waste and recycling'), html.P('Turn London waste into an opportunity – by reducing waste, reusing and recycling more of it.', className='lead'), dbc.Row([ dbc.Col(width=3, children=[ dbc.FormGroup([ html.H4("Select Area"), dcc.Dropdown(id="area_select", options=[{"label": x, "value": x} for x in data.area_list], value="London") ]), html.Br(), html.Div(id="output-panel") ]), dbc.Col(width=9, children=[ dbc.Tabs(className="nav nav-pills", children=[ dbc.Tab(dcc.Graph(id="recycle-chart", figure=fig1), label="Recycling by area"), dbc.Tab(dcc.Graph(id="recycle-year", figure=fig2), label="Recycling by year"), ]) ]), ]), ]) init_callbacks(dash_app) return dash_app.server
def card_mainlist(): card = dbc.Card([ dbc.CardBody([ dbc.Tabs([ dbc.Tab(tab_ca_content(app), tab_id="tab-ca", label="Current Assessment", tab_style={"margin-left": "8rem"}, label_style={ "padding-left": "2rem", "padding-right": "2rem", "font-family": "NotoSans-SemiBold", "font-size": "0.8rem", "color": "#381610" }), dbc.Tab(tab_pa_content(app), tab_id="tab-pa", label="Prior Assessment", label_style={ "padding-left": "2rem", "padding-right": "2rem", "font-family": "NotoSans-SemiBold", "font-size": "0.8rem", "color": "#381610" }), ], active_tab="tab-ca") ]), ]) return card
def get_layout(app, scenarios): session_id = str(uuid.uuid4()) return html.Div(children=[ html.Div(session_id, id="session-id", style={"display": "none"}), get_header(app), html.Main( className="dashboard", children=[ get_scenario_column(app, scenarios), html.Div(className="content", children=[ dbc.Tabs([ dbc.Tab([ get_filter_column(), get_aggregation_order_column(), get_save_load_column(app), get_units_column(), ], className="test", label="Filters"), dbc.Tab([ get_color_column(app), get_label_column(app), ], label="Presentation") ], ), get_graph_column() ]), get_footer() ], ), ], )
def make_layout(data): labels = ('Temperature', 'Pressure', 'Altitude', 'Humidity') logs = [ make_graph_bundled_tables([data['temp_log'], data['int_temp_log']], ['internal', 'external']), make_graph_table_pair(data['press_log']), make_graph_table_pair(data['alt_log']), make_graph_table_pair(data['hum_log']), ] tabs = [ dbc.Tab(wrap_in_card(log), label=label) for log, label in zip(logs, labels) ] tab_bar = dbc.Tabs(tabs) return html.Div( className="container", children=[ dbc.Alert('Welcome to the logs dashboard.', color='primary', className='mt-3'), dbc.Card([ dbc.CardHeader(html.H4('Location log', style={'margin': '0'})), dbc.CardBody([make_map_table_pair(data['loc_log'])]), ], className="my-3"), html.H4('Sensor logs'), tab_bar ])
def get_layout(): return html.Div([ html.Br(), dbc.Container([ html.H2('Visualize Collections'), dbc.Tabs([ dbc.Tab([dbc.Card(dbc.CardBody(get_plot_options_form()))], label='Options', tab_id='options-tab'), dbc.Tab([ dbc.Card( dbc.CardBody( dcc.Loading( html.Div(dcc.Graph(id='main-plot'), id='plot-wrapper')))), dbc.Card(dbc.CardBody(id='summary-table-wrapper')) ], label='Plot', tab_id='plot-tab') ], id='main-tabs', active_tab='options-tab') ]), html.Div('in', id='units-history', style={'display': 'none'}), html.Div(100, id='dpi-history', style={'display': 'none'}) ])
def build_tabs(simu): init_params(simu) tab1_content = build_chart_panel(simu) tab2_content = html.Div(children=build_cards(simu)) tab3_content = dbc.Card( dbc.CardBody([ build_sliders(), html.Div( className="row", children=[ html.Div(html.Button('Submit', id='submit-val', n_clicks=0)), html.Div( id="spin_pending", style={'visibility': 'none'}, children=[dbc.Spinner(color="warning", type="grow")]) ], style={"align-content": "center"}), ]), className="mt-3", ) tabs = dbc.Tabs([ dbc.Tab(tab1_content, label="Graphiques"), dbc.Tab(tab2_content, label="Vidéos"), dbc.Tab(tab3_content, label="Configuration"), ]) return html.Div([tabs])
def build_tabs(simu): init_params(simu) tab1_content = build_chart_panel(simu) tab2_content = html.Div(children= build_cards(simu)) tab3_content = dbc.Card( dbc.CardBody( [ build_sliders(), html.Div(className="row", children=[ html.Div(html.Button('Submit', id='submit-val', n_clicks=0)), html.Div(id="spin_pending", style={ 'vertical-align':'center'},children=[]), ] )], className="mt-3", ) ) tabs = dbc.Tabs( [ dbc.Tab(tab1_content, label="Graphiques"), dbc.Tab(tab2_content, label="Vidéos"), dbc.Tab(tab3_content, label="Configuration"), ] ) return html.Div([tabs])
def extract_button(n_clicks, temp, labels): global ner_table if n_clicks is None: return dbc.Alert( "Please input text or upload file to begin.", color="primary", ) else: print(n_clicks) print(temp) print(labels) try: if labels is None: labels = "" ner_table = get_ner(temp, labels) if labels != "": labels = labels.replace(", ", ",").split(",") ner_table = ner_table[ner_table["tags"].isin(labels)] return [ dbc.Tabs( [ dbc.Tab(label="Output", tab_id="tab-1"), dbc.Tab(label="Analysis", tab_id="tab-2"), ], id="output-tabs", active_tab="tab-1", ), html.Div(id="output-content"), ] except Exception as e: print(e) return dbc.Alert( "There was an error handling your request. Please try again.", color="danger", )
def serve_layout(): layout = html.Div(children=[ # banner html.Div(className="zvt-banner", children=html.H2(className="h2-title", children="ZVT")), dbc.CardHeader( dbc.Tabs( [ dbc.Tab(label="factor", tab_id="tab-factor", label_style={}, tab_style={"width": "100px"}), dbc.Tab(label="trader", tab_id="tab-trader", label_style={}, tab_style={"width": "100px"}), ], id="card-tabs", card=True, active_tab="tab-factor", )), dbc.CardBody(html.P(id="card-content", className="card-text")), ]) return layout
def make(prefix: str, tab_def, previous_active: str = None, default_tab_content=None): """ Create tab bar and container for the layer information sub-panel """ if previous_active is not None and previous_active in list(tab_def.keys()): active_tab = previous_active elif len(tab_def) > 0: active_tab = list(tab_def)[0] else: active_tab = '' return [ dbc.Tabs( id=prefix + "-tab-bar", active_tab=active_tab, children=[dbc.Tab(label=tab_def[t], tab_id=t) for t in tab_def]), html.Div(className="p-2 detail-tab border-left", key=prefix + "-tab-wrap", children=[ html.Div(id=prefix + "-tab-content", key=prefix + "-tab-content-wrap", children=default_tab_content), html.Div(id=prefix + "-tab-figure", hidden=True, key=prefix + "-tab-figure-wrap", children=dcc.Graph(id=prefix + '-figure', config=_get_graph_config())) ]) ]
def __init__(self, tab_roles, title=None, sidebar_columns=4, **kwargs): """ Template that includes a title bar, places inputs in a sidebar, and outputs in a set of tabs. :param tab_roles: List or dict of strings where each string specifies the name of the role corresponding to a single tab. If a list, the role name is also be used as the title of the corresponding tab. If a dict, the keys become the roles and the values become the tab labels :param title: Title bar title string :param sidebar_columns: Responsive width of input card in columns (out of 12 columns) """ import dash_bootstrap_components as dbc # Set valid roles before constructor self.title = title self.sidebar_columns = sidebar_columns if isinstance(tab_roles, (list, tuple)): self.tab_roles = OrderedDict([(role, role) for role in tab_roles]) else: self.tab_roles = OrderedDict(tab_roles) self._valid_roles = ["input", "output"] + list(self.tab_roles.keys()) first_tab = next(iter(self.tab_roles)) self._tabs = dbc.Tabs(id=build_id("tabs"), active_tab=first_tab) super().__init__(**kwargs)
def indicator_line(): return html.Div( id="indicator_line_id", className="lineBlock card", children=[ html.H4("Indicators"), html.Div( className="card-body row", children=[ html.Div( className="col-6", children=[ html.H6( className="text-center", children= "Rewards instant + cumulated for 2 agent", ), dbc.Tabs(children=[ dbc.Tab( label="Instant Reward", children=[ dcc.Graph( id="rewards_ts", figure=go.Figure(layout=layout_def, ), ) ], ), dbc.Tab( label="Cumulated Reward", children=[ dcc.Graph( id="cumulated_rewards_ts", figure=go.Figure(layout=layout_def, ), ) ], ), ]), ], ), html.Div( className="col-6", children=[ html.H6( className="text-center", children= "Distance from reference grid configuration", ), dcc.Graph( id="actions_ts", figure=go.Figure(layout=layout_def, data=[dict(type="scatter")]), ), ], ), ], ), ], )
def render(): global view_mode view_mode.clear() content = dbc.Container([ dbc.Row(html.H5(["Price History"])), dbc.Row([ dcc.Dropdown( id=f'{card_name}-sectors', options=[{'label': s, 'value': s} for s in industries], value="Tất cả", style = {"width": "100%"} ) ]), dbc.Row([ dcc.Dropdown( id=f'{card_name}-symbols', options=[{'label': s, 'value': s} for s in list_symbols], value=[], multi=True, style = {"width": "100%"}, clearable=False ) ]), dbc.Tabs(id=f"{card_name}-tabs"), html.Div(id=f"{card_name}-tab-content", className="p-4"), ], style={"max-width": "1600px"}) return content
def glacier_and_oil_impacts(app): tabs = dbc.Tabs([ dbc.Tab(oil_tab(app), label="Impact of Oil Production"), dbc.Tab(glaciers_tab(app), label="Impact of Glaciers"), dbc.Tab(area_tab(app), label="Area Changes"), ]) return tabs
def layout(): """ Returns page layout. Modifications of page structure should be passed here :return: Layout """ div = html.Div(id='seq-view-body', className='app-body', children=[ dcc.Store(id='session-store', storage_type='session'), html.Div(id='seq-view-control-tabs', className="six columns div-user-controls", children=dbc.Container( dbc.Tabs(id='main-tabs', children=[ tab_about_content, tab_upload_content, tab_errors_content, tab_statistics_content ], active_tab="tab-about"), )), dbc.Container(className="five columns", fluid=True, children=dcc.Loading( id="right-pane", type="default", fullscreen=False, className="six columns", )) ]) return div
def population_vs_electricity_section(app): tabs = dbc.Tabs([ dbc.Tab(tab_1_content(app), label="Production Sources"), dbc.Tab(tab_2_content(app), label="Impact of Poverty"), dbc.Tab(tab_3_content(app), label="Impact of Population"), ]) return tabs
def choose_assist_line(network_graph): return html.Div( id="choose_assist_line", className="lineBlock card", children=[ html.H4("Choose or Assist"), html.Div( className="card-body row", children=[ html.Div( id="div-choose-assist", className="col-7 chooseAssist", children=[ dbc.Card( [ dbc.CardHeader( dbc.Tabs( id="tabs-choose-assist-method", card=True, active_tab="tab-choose-method", children=[ dbc.Tab( label="Choose", tab_id="tab-choose-method", ), dbc.Tab( label="Assist", tab_id="tab-assist-method", ), ], ) ), dbc.CardBody( html.Div(id="tabs-choose-assist-method-content") ), ] ), ], ), html.Div( className="col-5", id="div-network-graph-choose-assist", children=[ html.H5("Network at time step t"), html.Div( id="graph_div", children=[ dcc.Graph( id="network_graph_choose", figure=network_graph, ) ], ), ], ), ], ), ], )
def make_city(row, crime_over_time, size_filter, diversity_filter, education_filter, wealth_filter, home_price_filter, weather_filter, covid_filter, profession_filter, transit_filter, poverty_filter, age_filter, df, eid=None): if eid == None: eid = row.name # Find wikipedia content summary = row["wikipedia_summary"] return html.Div( children=[ dbc.Card( children=[ # Title dbc.CardHeader(children=[ html.Span(html.B(row["city"])), html.Span(", " + row["state_id"]), html.Span( badges(row, size_filter, diversity_filter, education_filter, wealth_filter, home_price_filter, weather_filter, covid_filter, profession_filter, transit_filter, poverty_filter, age_filter)) ]), dbc.CardBody([ html.P(summary, style={ "paddingBottom": "5px", "textIndent": "25px" }), dbc.Tabs([ dbc.Tab("", label="PICK A TAB ->"), dbc.Tab(pop_dem_tab(row), label="POP & DEM"), dbc.Tab(safety_tab( crime_over_time[crime_over_time['state_name_x'] == row["state_name_x"]]), label="SAFETY"), dbc.Tab(weather_tab(df, row['state_name_x'], row['city']), label="WEATHER"), ]) ]), ], className="mb-3", ), ], className="city-card")
def router_dash1(router_id): return html.Div([ dcc.Interval(id="update",n_intervals=0,interval=60000), dbc.Tabs(id='dash_tabs'+router_id,active_tab='dash'+router_id,children=[ dbc.Tab(label='Dashboard',tab_id='dash'+router_id,id='dash'+router_id)]), html.Div(id='dash_contents'+router_id) ])
def machine_learning_results(app): tabs = dbc.Tabs([ dbc.Tab(predictor_tab(app), label="Temperature Predictor"), dbc.Tab(glacier_model_tab(app), label="Complete Dataset - Glaciers"), dbc.Tab(sea_level_model_tab(app), label="Complete Dataset - Sea Level"), ]) return tabs
def form_tabs(params): return dbc.Tabs([ dbc.Tab( dbc.Card(dbc.CardBody(form_builder(i, params))), label=f"Grupo {i}", activeLabelClassName="btn btn-primary", ) for i in range(1, 4) ])
def build_tabs4(): return dbc.Tabs( [ dbc.Tab(build_graph_red_2(), label="Forecast"), dbc.Tab(build_graph_red_1(), label="Compliance"), ], id="tabs4", className="navbar navbar-expand-md", )
def create_layout(): layout = html.Div([ html.H4(html.Strong('GLOBAL COVID-19 DASHBOARD'), id='title'), dbc.Tabs([ dbc.Tab(create_dashboard(), label="Dashboard"), dbc.Tab('', label="About"), ]) ]) return layout
def build_tabs3(): return dbc.Tabs( [ dbc.Tab(build_graph_temp_2(), label="Temperature Change"), dbc.Tab(build_graph_temp_1(), label="Meanfeals vs Temperature"), ], id="tabs3", className="navbar navbar-expand-md", )
def input_panel_1(): label = dbc.CardHeader(html.H4("Parameters")) boby = html.Div([kernel(), inverse_dimensions()]) button = dbc.Button("Generate kernel", id="INV-generate-kernel") inv = inversion() tab1 = dbc.Tab(label="Kernel", children=[boby, button]) tab2 = dbc.Tab(label="Inversion parameters", children=inv) return dbc.Card([label, dbc.Tabs([tab1, tab2])])
def catastrophe_section(app): tabs = dbc.Tabs([ dbc.Tab(catastrophe_vs_options_tab_2(app), label="Catastrophe Over the Years"), dbc.Tab(sea_level_vs_others_tab_1(app), label="Sea Level Rise"), dbc.Tab(catastrophe_combined_graph_vs_options_tab_3(app), label="Trends in affects of other factors") ]) return tabs
def TabsFeatures(self): tabs_list = [dbc.Tab(label='temperature', tab_id='temperature-tab'), dbc.Tab(label='apparentTemperature', tab_id='apparentTemperature-tab'), dbc.Tab(label='dewPoint', tab_id='dewPoint-tab'), dbc.Tab(label='humidity', tab_id='humidity-tab'), dbc.Tab(label='pressure', tab_id='pressure-tab'), dbc.Tab(label='windSpeed', tab_id='windSpeed-tab'), dbc.Tab(label='ozone', tab_id='ozone-tab')] return dbc.Tabs(tabs_list, id="grapher-tabs", active_tab="temperature-tab", style={"text-align": "center"})
def macro_component(): """ The main macro panel :return: """ title = "Macro Data" output_row = dbc.Row( dbc.Tabs( id="macro-tab-selector", active_tab="ust-curve", children=[ dbc.Tab(label="US Treasury Curve", tab_id="ust-curve", children=[subpanel.usd_treasury_curve()]), dbc.Tab( label="USD Swap Curve", tab_id="usd-swap-curve", children=[ subpanel.usd_swap_curve(), dbc.Col([ html.A( dbc.Button("Data Citations", className="mr-1", id="usd-swap-citations-button")) ], width=4), dbc.Popover( [ dbc.PopoverHeader("USD Swap Citations"), dbc.PopoverBody([ dbc.ListGroup([ dbc.ListGroupItem([ dbc.ListGroupItemHeading( f"ICE USD Swap {yr} Yr"), dbc.ListGroupItemText( dl.macro.get_usd_swap_citation( yr)) ]) for yr in dl.macro.maturities ]) ]) ], id="usd-swap-citations", is_open=False, target="usd-swap-citations-button", ) ]), dbc.Tab(label="Coming Soon...", tab_id="coming-soon", disabled=True) ])) obj = panel_template(title, output_row) return obj