def layout(self): return html.Div([ dbc.Row([ make_hideable( dbc.Col([ html.H2('Model Performance:')]), hide=self.hide_title), ]), dbc.Row([ make_hideable( dbc.Col([ self.cutoffpercentile.layout(), ]), hide=self.hide_globalcutoff), ], style=dict(marginTop=25, marginBottom=25)), dbc.CardDeck([ make_hideable(self.summary.layout(), hide=self.hide_modelsummary), make_hideable(self.confusionmatrix.layout(), hide=self.hide_confusionmatrix), ], style=dict(marginBottom=25)), dbc.CardDeck([ make_hideable(self.precision.layout(), hide=self.hide_precision), make_hideable(self.classification.layout(), hide=self.hide_classification) ], style=dict(marginBottom=25)), dbc.CardDeck([ make_hideable(self.rocauc.layout(), hide=self.hide_rocauc), make_hideable(self.prauc.layout(), hide=self.hide_prauc), ], style=dict(marginBottom=25)), dbc.CardDeck([ make_hideable(self.liftcurve.layout(), self.hide_liftcurve), make_hideable(self.cumulative_precision.layout(), self.hide_cumprecision), ], style=dict(marginBottom=25)), ])
def layout(self): return dbc.Container([ dbc.Row([ make_hideable( dbc.Col([ html.H1(self.title) ]), hide=self.hide_title), ]), dbc.Row([ make_hideable( dbc.Col([ self.index.layout(), ], md=7), hide=self.hide_whatifindexselector), make_hideable( dbc.Col([ self.prediction.layout(), ], md=5), hide=self.hide_whatifprediction), ], style=dict(marginBottom=15, marginTop=15)), dbc.CardDeck([ make_hideable(self.input.layout(), hide=self.hide_inputeditor), ], style=dict(marginBottom=15, marginTop=15)), dbc.CardDeck([ make_hideable(self.contribgraph.layout(), hide=self.hide_whatifcontributiongraph), make_hideable(self.pdp.layout(), hide=self.hide_whatifpdp), ], style=dict(marginBottom=15, marginTop=15)), dbc.Row([ make_hideable( dbc.Col([ self.contribtable.layout() ], md=6), hide=self.hide_whatifcontributiontable), dbc.Col([], md=6), ]) ], fluid=True)
def update(selected): if selected: # selected is an object that looks like {'points': [{'location': ...}]} location = selected["points"][0]["location"] onestate = (df_usa.groupby("Province_State").sum()[ df_usa.columns[11:]].loc[location]) fig = px.line( x=pd.to_datetime(onestate.index), y=onestate, color_discrete_sequence=["#23C6EF"], ) fig.update_layout( title={ "text": f"{location} Cases", "font_size": 20, "y": 0.9, "x": 0.5, "xanchor": "center", "yanchor": "top", }) fig.update_layout(DEFAULT_PLOT_LAYOUT) fig.update_xaxes(title_text="Date") fig.update_yaxes(title_text="Frequency") fig.update_xaxes(tickangle=315) news_cards = generate_cards(location.replace(" ", "+")) my_card_deck = [ dbc.CardDeck(news_cards[:5]), dbc.CardDeck(news_cards[5:10]) ] return fig, my_card_deck else: all_states = df_usa.sum()[df_usa.columns[11:]] fig = px.line( x=pd.to_datetime(all_states.index), y=all_states, color_discrete_sequence=["#23C6EF"], ) fig.update_layout( title={ "text": "United States Cases", "font_size": 20, "y": 0.9, "x": 0.5, "xanchor": "center", "yanchor": "top", }) fig.update_layout(DEFAULT_PLOT_LAYOUT) fig.update_xaxes(title_text="Date") fig.update_yaxes(title_text="Frequency") fig.update_xaxes(tickangle=315) news_cards = generate_cards() my_card_deck = [ dbc.CardDeck(news_cards[:5]), dbc.CardDeck(news_cards[5:10]) ] return fig, my_card_deck
def serve_layout(): uimgs = db.session.query(User_Image).all() return dbc.Container([ html.H1("View Uploaded Images"), html.Div(id=f'{APP_ID}_view_div', children=[ dbc.CardDeck([ dbc.Card([ dbc.CardImg(src=f"data:image/jpg;base64, {b64encode(uimg.thumb).decode('utf-8')}", top=True, style={"width": "18rem"}), dbc.CardBody([ html.H4(uimg.name), html.P(uimg.creator), dbc.Button('Enlarge', id=f'{APP_ID}_card_button_uimg{uimg.id}', color='primary') ]), dbc.CardFooter( dbc.CardLink('Web Link', href=f'{uimg.img_web_url}', external_link=True, target="_blank") ) ], style={"max-width": "18rem"}, ) for uimg in uimgs ], ) ] ), # todo add modal display ])
def render(): element = html.Div([ html.P( "Fill up your data and the machine will try to choose the best major for you!", id="output-welcome", ), dbc.Alert( id="output-error", color="danger", className="d-none", ), html.Div( dbc.CardDeck( [ FirstHeader.render(), SecondHeader.render(), ThirdHeader.render() ], className="mt-3", ), id="output-deck", className="d-none", ), ], id="output-container") return element
def render_indicators(df): rdays = df['mobility_limitation'].dropna().cumsum().iloc[-1] icu_cap = ((df['available_icu_units'] / df['total_icu_units']) < 0.1).sum() dead = df['dead'].dropna().iloc[-1] deck = [] deck.append( dbc.Card( dbc.CardBody([ html.H6(_('Restriction Day Index')), html.P('%d' % rdays, className="display-4 text-primary mb-1"), html.Small( _('''The cumulative sum of daily percentages of mobility restrictions. The index can be used as a rough indicator of harmful psychological, social and economic effects. A higher index means more severe effects.''' )), ]))) deck.append( dbc.Card( dbc.CardBody([ html.H6(_('Days ICU Capacity Exceeded')), html.P('%d' % icu_cap, className="display-4 text-primary mb-1"), html.Small( str( _("Number of days that ICU units had less than 10%% of capacity left." )).replace('%%', '%')), ]))) deck.append( dbc.Card( dbc.CardBody([ html.H6(_('Fatalities')), html.P('%d' % dead, className="display-4 text-primary mb-1"), html.Small( _("Total number of deaths at the end of simulation.")), ]))) return dbc.CardDeck(deck, className='mb-4')
def cardDeck(): cards = dbc.CardDeck( [ dbc.Card( dbc.CardBody( [ html.H5("Avg Paid", className="card-title"), html.P( id = 'avg-rating' ,className="card-text" ) ] ) ), dbc.Card( dbc.CardBody( [ html.H5("Records", className="card-title"), html.P(id ='records' ,className="card-text" ) ] ) ), ] ) return cards
def layout(self): return dbc.Container([ dbc.CardDeck([ make_hideable(self.interaction_summary.layout(), hide=self.hide_interactionsummary), make_hideable(self.interaction_dependence.layout(), hide=self.hide_interactiondependence), ], style=dict(marginTop=25)) ], fluid=True)
def build_info_cards(): """Build the top row of the layout with info cards. Returns ------- cards : dash_bootstrap_components.CardDeck CardDeck with info cards. CardDeck takes care that all cards are the same height and width. """ cards = dbc.CardDeck(children=[ info_card(ident="info-box-bestseller", icon="fa fa-heart", title="Bestseller des Monats", value="", color="#802020", fontsize="300%"), info_card(ident="info-box-royal", icon="fa fa-crown", title="Getränkekönig*in", value="", color="#a07000", fontsize="300%"), info_card(ident="info-box-revenue", icon="fa fa-money-bill-wave", title="", value="", color="#216b27", fontsize="300%"), ]) return cards
def make_details(): mcards = [] latest = mongoClient.get_latest_sensor_value("bme1_humidity") mcards.append((dbc.CardImg(src = "assets/humidity_in.png", style = {"width": "50px"}), dbc.CardBody(f"{latest} %"))) latest = mongoClient.get_latest_sensor_value("428F_94_hum") mcards.append((dbc.CardImg(src = "assets/humidity_out.png", style = {"width": "50px"}), dbc.CardBody(f"{latest} %"))) latest = mongoClient.get_latest_sensor_value("bme1_pressure") values = get_and_merge_data("bme1_pressure", 24) values = values.asof(to_utc() - datetime.timedelta(hours = 6))["val"] updown = "stable" if np.abs(latest - values) < 1 else ("up" if (latest - values > 0) else "down") mcards.append((dbc.CardImg(src = f"assets/barometer_in_{updown}.png", style = {"width": "50px"}), dbc.CardBody(html.P(f"{latest} mm Hg")))) obs = owm.get_latest_info()["obs"] feels = obs.temperature("celsius")["feels_like"] mcards.append((dbc.CardImg(src = "assets/feel.png", style = {"width": "50px"}), dbc.CardBody(f"{feels}\u00B0C"))) wind = obs.wind()["speed"] mcards.append((dbc.CardImg(src = "assets/wind.png", style = {"width": "50px"}), dbc.CardBody(f"{wind} km/h"))) rain = obs.rain if len(rain) == 0: rain = "N/A" else: rain = f"{rain['1h']} mm" mcards.append((dbc.CardImg(src = "assets/rain_level.png", style = {"width": "50px"}), dbc.CardBody(f"{rain}"))) return dbc.Row(dbc.CardDeck([dbc.Col(c, width = 5) for c in mcards], className = "weather"))
def layout(self): return dbc.Container([ dbc.CardDeck([ make_hideable(self.shap_summary.layout(), hide=self.hide_shapsummary), make_hideable(self.shap_dependence.layout(), hide=self.hide_shapdependence), ], style=dict(marginTop=25)), ], fluid=True)
def layout(self): return html.Div([ dbc.Row([ make_hideable( dbc.Col([ html.H2('Model Performance:')]), hide=self.hide_title) ]), dbc.CardDeck([ make_hideable(self.modelsummary.layout(), hide=self.hide_modelsummary), make_hideable(self.preds_vs_actual.layout(), hide=self.hide_predsvsactual), ], style=dict(margin=25)), dbc.CardDeck([ make_hideable(self.residuals.layout(), hide=self.hide_residuals), make_hideable(self.reg_vs_col.layout(), hide=self.hide_regvscol), ], style=dict(margin=25)) ])
def layout(params): # This function must return a layout for the homepage return dbc.Container( [ html.Div( [ html.H5('Choose a page to view'), ], className='px-3 py-3 pt-md-5 pb-md-4 mx-auto text-center' ), dbc.CardDeck( [ dbc.Card( [ dbc.CardHeader(page.get('name', '')), dbc.CardBody( [ html.P(page.get('description', '')), html.A('View', href=page.get('path', '/'), className='btn btn-block btn-outline-primary') ], className='d-flex flex-column' ) ], className='mb-3 mx-auto' ) for page in config.get('pages', []) ], className='homepage mb-3' ) ], )
def layout(self): return dbc.Container([ dbc.Row([ dbc.Col([ html.H1(self.title, id='simple-regression-composite-title'), ]) ]), dbc.Row([ dbc.Col([ html.H2("Model performance"), dbc.CardDeck([ make_hideable(self.goodness_of_fit.layout(), hide=self.hide_goodness_of_fit), make_hideable(self.regression_custom_component.layout(), hide=self.hide_regression_custom_component), ], style=dict(marginTop=25, marginBottom=25)), ]) ]), dbc.Row([ dbc.Col([ html.H3("SHAP values"), dbc.CardDeck([ make_hideable(self.shap_summary.layout(), hide=self.hide_shapsummary), make_hideable(self.shap_dependence.layout(), hide=self.hide_shapdependence), ], style=dict(marginTop=25, marginBottom=25)), ]) ]), dbc.Row([ dbc.Col([ html.H2("Individual predictions"), dbc.CardDeck([ make_hideable(self.index.layout(), hide=self.hide_predindexselector), make_hideable(self.summary.layout(), hide=self.hide_predictionsummary), ], style=dict(marginBottom=25, marginTop=25)), dbc.CardDeck([ make_hideable(self.contributions.layout(), hide=self.hide_contributiongraph), ], style=dict(marginBottom=25, marginTop=25)) ]) ]) ])
def get_layout(): """ Creates the dash layout """ navbar_right = dbc.Row( [ dbc.DropdownMenu( label="Pages", children=[ dbc.DropdownMenuItem( x[1:], href=x, id="section_{}".format(x[1:])) for x in c.dash.LINKS_ALL ], direction="left", className="mr-1", ), dbc.Button("Filters", id="filters-button", className="mr-1", color="danger"), ], no_gutters=True, className="ml-auto", align="center", ) navbar = dbc.Navbar( [ dbc.Row( [ dbc.Col(html.Img(src="assets/logo.png", height="30px")), dbc.Col(dbc.NavbarBrand("Expensor", className="ml-2")), ], align="center", no_gutters=True, ), navbar_right, ], sticky="top", className="w3-light-grey w3-card", ) filters = dbc.Collapse(dbc.CardDeck(id="filters"), id="filters-container", style=padding(2 * DEFAULT_PADDING)) content = [ # Body html.Div(id="body", style=padding()), # Others html.Div(id="sync_count", style={"display": "none"}), dcc.Location(id="url", refresh=False), # Hidden div with data html.Div(df_to_b64(DF), id="global_df", style=c.styles.STYLE_HIDDEN), ] return html.Div([navbar, filters] + content)
def layout(self): return dbc.Container([ dbc.CardDeck([ make_hideable(self.index.layout(), hide=self.hide_predindexselector), make_hideable(self.summary.layout(), hide=self.hide_predictionsummary), ], style=dict(marginBottom=25, marginTop=25)), dbc.CardDeck([ make_hideable(self.contributions.layout(), hide=self.hide_contributiongraph), make_hideable(self.pdp.layout(), hide=self.hide_pdp), ], style=dict(marginBottom=25, marginTop=25)), dbc.Row([ dbc.Col([ make_hideable(self.contributions_list.layout(), hide=self.hide_contributiontable), ], md=6), dbc.Col([ html.Div([]), ], md=6), ]) ], fluid=True)
def make_gallery_row(row): return dbc.Row( dbc.CardDeck( [ make_card( f"id_card{i+row}", gallery[i + row].image, gallery[i + row].title, gallery[i + row].source_code, gallery[i + row].about, ) for i in range(CARDS_PER_ROW) ], className=" mx-2", ))
def get_cards(): return html.Div([ dbc.CardDeck( [ dbc.Card( dbc.CardBody([ html.H5("Aktuelle Temperatur", className="card-title"), html.H1("--", id='current-temp-text', style={'color': 'skyblue'}), html.P( [ "Messwert vom:", html.Br(), #DataProviderSingleton.getInstance().get_latest_datetime().strftime('%d.%m.%Y, %H:%M Uhr') '--' ], id='current-temp-datetime', className="card-text") ])), dbc.Card( dbc.CardBody([ html.H5("Temperaturdurchschnitt", className="card-title"), html.H1("--", id='average-temp-text', style={'color': 'skyblue'}), html.P([ "Berücksichtigter Zeitraum:", html.Br(), "--", ], id='average-temp-datetime', className="card-text") ])), dbc.Card( dbc.CardBody([ html.H5("Veränderung", className="card-title"), html.H1("--", id='temp-tendency-text', style={'color': 'skyblue'}), html.P( "Die aktuelle Veränderung kann steigend, sinkend oder stabil sein", className="card-text", ) ])), ], className="mt-3 ml-1 mr-1") ])
def _generate_comparison_layout(self, graph_one, graph_two): """ Returns and generates a dual comparison layout. :param graph_one: (Graph) The first graph object for the dual interface. :param graph_two: (Graph) Comparison graph object for the dual interface. :return: (html.Div) Returns a Div containing the interface. """ # Set Graph names graph_one_name = type(graph_one).__name__ graph_two_name = type(graph_two).__name__ # Set the cyto graphs self._set_cyto_graph() # Get different edges between two graphs difference = graph_one.get_difference(graph_two) # Layout components padding = {'padding': '10px 10px 10px 10px'} cards = dbc.CardDeck([ dbc.Card([ dbc.CardHeader(graph_one_name), dbc.CardBody(self.cyto_one), ], ), dbc.Card( [dbc.CardHeader(graph_two_name), dbc.CardBody(self.cyto_two)], ) ], style=padding) summary = dbc.Card([ html.H5("Summary", className="card-title"), html.P("{} nodes in each graph and {} different edge(s) per graph." .format(graph_one.get_graph().number_of_nodes(), int(len(difference) / 2)), className="card-text") ], className="w-50", style={ 'margin': '0 auto', 'padding': '10px 10px 10px 10px' }) layout = html.Div([ dbc.Row(dbc.Col(cards, width=12, align='center')), summary, ], style={'padding-bottom': '10px'}) return layout
def __init__(self, datamodel): super().__init__("Country", datamodel) self.content = dbc.Col( [ dbc.Row(dbc.Col(self.__create_country_dropdown())), html.Br(), dbc.Row( dbc.Col([ dbc.CardDeck([ panel.create_card("Total cases", "", "lb_confirmed"), panel.create_card("Recovered", "", "lb_recovered"), panel.create_card("Deaths", "", "lb_deaths", "death_text"), ]) ])), html.Br(), dbc.Row(dbc.Col(self.__create_button_groups())), dbc.Row( dbc.Col( [ html.Iframe( id="chart_confirmed_trend", style={ "border-width": "0", "width": "100%", "height": "300px", }, ) ], width=12, ), ), dbc.Row( dbc.Col( html.Iframe( id="chart_deaths_trend", style={ "border-width": "0", "width": "100%", "height": "300px", }, ), width=12, ), ), ], width=12, )
def importing_layout(demo=False): m = dbc.Container(children=[ dbc.Row(children=[ dbc.Col(children=[ cc.importing_greeting(demo=demo) ]) ]), dbc.Row(children=[ dbc.Col(children=[ dbc.CardDeck(children=[ cc.importing_dataset_dropdown(), cc.importing_user_dataset_list(demo=demo), cc.importing_data_upload(demo=demo), ]), ]) ], id="upload-collapse") ], fluid=True) return m
def serve_layout(): """Build the top-level dashboard layout. Contains two hidden divs with the number of the currently selected state and the colormap sharedSacross callbacks. Returns ------- layout : dash_bootstrap_components.Container Bootstrap container with the top-level layout. """ layout = dbc.Container( style={'max-width': '2000px'}, children=[ # update every 15 minutes dcc.Interval( id='interval-component', interval=15 * 60 * 1000, # in milliseconds n_intervals=0), # hidden div for shared data html.Div(id='shared_data', children=[], style={'display': 'none'}), # title html.H1(children=('Getränkekasse'), className='display-3', style={ 'margin-top': '3rem', 'margin-bottom': '3rem' }), # info boxes html.P(dbc.Row(children=[dbc.Col(build_info_cards(), width=12)])), html.P( dbc.Row(children=[ dbc.Col(build_timeline(), width=9), dbc.Col(build_debt_table(), width=3) ])), # content html.P( dbc.CardDeck( children=[build_inventory_overview(), build_chart()])), ], ) return layout
def get_summary(dfs): """ Gets a list of h6 with data from previous month """ mdate = date.today() date_m1 = mdate.replace(day=1) - timedelta(days=1) date_m2 = date_m1.replace(day=1) - timedelta(days=1) # Get stats for last month and the month previous to the last one stats = _get_stats(dfs, date_m1) stats2 = _get_stats(dfs, date_m2) # Header of the summary data = [["Stats for months", "{:%Y/%m} ({:%Y/%m})".format(date_m1, date_m2), "secundary"]] # Fill the summary with relevant stats for name, color in c.colors.COLORS_CARDS.items(): # bool stating if it is better than previous month (expenses should be reversed) aux = stats[name] > stats2[name] symbols = ARROWS[not aux if name == c.names.EXPENSES else aux] # space as thousand separator text = f"{stats[name]:,.0f}€ ({stats2[name]:,.0f}€) {symbols}".replace(",", ".") data.append([name, text, color]) # Show a text with transactions excel file date name = get_money_lover_filename() data.append(["Using data from", name.split(".")[0].replace("-", "/"), "secundary"]) return dbc.CardDeck( [ dbc.Card( [dbc.CardTitle(title), dbc.CardText(text)], color=color, className="w3-center", style=lay.padding(), ) for title, text, color in data ], style=lay.padding(), )
def createCardDeck(distance,duration,speed,calories): if duration.total_seconds() < 3600: durationStr = str(duration.components[2])+'m '+str(duration.components[3])+'s' elif duration.total_seconds() < 86400: durationStr = str(duration.components[1])+'h '+str(duration.components[2])+'m '+str(duration.components[3])+'s' else: durationStr = str(duration.components[0])+'j '+str(duration.components[1])+'h '+str(duration.components[2])+'m '+str(duration.components[3])+'s' cardDeck = dbc.CardDeck([ dbc.Card(color="primary",inverse=True,children=[ dbc.CardImg(src="static/distance.png",top=True), dbc.CardBody([ html.H5("Distance",className="card-title"), html.P("{:.2f}".format(distance)+" km",className="card-text text-center") ]) ]), dbc.Card(color="primary",inverse=True,children=[ dbc.CardImg(src="static/duration.png",top=True), dbc.CardBody([ html.H5("Durée",className="card-title"), html.P(durationStr,className="card-text text-center") ]) ]), dbc.Card(color="primary",inverse=True,children=[ dbc.CardImg(src="static/speed.png",top=True), dbc.CardBody([ html.H5("Vitesse",className="card-title"), html.P("{:.2f}".format(speed)+" km/h",className="card-text text-center"), # html.P((df['Average Pace'].mean()+ pd.to_datetime('1970/01/01')).strftime('%M:%S')+" min/km",className="card-text text-center") ]) ]), dbc.Card(color="primary",inverse=True,children=[ dbc.CardImg(src="static/burn.png",top=True), dbc.CardBody([ html.H5("Calories",className="card-title"), html.P(str(calories)+" kcal",className="card-text text-center") ]) ]) ]) return cardDeck
def update_cards(df): confirmed = f'{int(round(df.confirmed.sum() / 1)):,}' active = f'{int(round(df.active.sum() / 1)):,}' recovered = f'{int(round(df.recovered.sum() / 1)):,}' critical = f'{int(round(df.critical.sum() / 1)):,}' deaths = f'{int(round(df.deaths.sum() / 1)):,}' metric = (active, recovered, critical, deaths) label = ('Active', 'Recovered', 'Critical', 'Deaths') cards = \ html.Div([ dbc.Row([ dbc.Col(html.H3('Worldwide Cases : ' + confirmed, id='metric-title'), md=8, xs=12), dbc.Col(dbc.Row([ html.Div(dcc.Dropdown( id='dropdown', options= [{'label': 'Worldwide', 'value': 'Worldwide'}] + [{'label': val, 'value': val} for val in df.country.sort_values(ascending=True).values], placeholder='Country filter', ), id='dropdown_div'), dbc.Button("Refresh", color="primary", id='data_refresh') ]), md=4, id='country-search', className="row justify-content-center"), ], id='dashboard_title'), dbc.CardDeck( [ dbc.Card( html.Div([ html.P(lab, className='metric_text'), html.H4(met, className='metric_text'), ], className='metric_body' ), className='card border-0' ) for met, lab in zip(metric, label) ], id='metric' ) ]) return cards
def project_summary(df_latest): number_of_active_projects = df_latest.shape[0] avr_donation_size = int( (df_latest.donated_amount_in_euro / df_latest.donations_count).replace( [np.inf, -np.inf], np.nan).dropna().mean()) mask = (df_latest['created_at'] > dt.now().replace( day=1, hour=1, minute=1, second=1, tzinfo=None)) number_project_current_month = df_latest[mask].shape[0] mydate = datetime.datetime.now() month_name = mydate.strftime("%B") card_deck = dbc.CardDeck([ dbc.Card([ dbc.CardHeader(html.B("Active Projects")), dbc.CardBody([ daq.LEDDisplay(value=number_of_active_projects, color="black") ], style={'textAlign': 'center'}) ], className="mt-2 mr-1"), dbc.Card([ dbc.CardHeader(html.B("Average donation size (€)")), dbc.CardBody( [daq.LEDDisplay(value=avr_donation_size, color="black")], style={'textAlign': 'center'}) ], className="mt-2 ml-1 mr-1"), dbc.Card([ dbc.CardHeader(html.B("New projects in {}".format(month_name))), dbc.CardBody([ daq.LEDDisplay(value=number_project_current_month, color="black") ], style={'textAlign': 'center'}) ], className="mt-2 ml-1") ]) return card_deck
def count_report_cards(counts): """ A type of report where each attribute and its count is presented as a card. Used for general observations. """ return dbc.CardDeck([ dbc.Card( [ dbc.CardBody([ html.H5(label_translations[c[0]], className="card-title"), html.P(f'{c[1]} defectos', className="card-text"), ]), dbc.CardFooter( dbc.Button("Más información", id={ "type": "observation_card", "index": c[0] })) ], className="mt-3 md-3", ) for c in counts ], )
def render(): element = html.Div([ html.P( "Fill up your scores and we'll try to choose the best concentration for you!", id="manual-welcome", ), dbc.Alert( id="manual-error", color="danger", className="d-none", ), html.Div( dbc.CardDeck( [IMDDHeader.render(), MIHeader.render(), SEHeader.render()], className="mt-3", ), id="manual-deck", className="d-none", ), ], id="manual-output-container" ) return element
def make_highlights(): mcards = [] values = get_and_merge_data("bme1_temperature", 24) vmax = values["val"].max() vmin = values["val"].min() mcards.append((dbc.CardImg(src = "assets/in_house.png", style = {"width": "50px"}), dbc.CardBody([html.P(f"Max: {vmax}\u00B0C"), html.P(f"Min: {vmin}\u00B0C")]))) values = get_and_merge_data("bme1_humidity", 24) vmax = values["val"].max() vmin = values["val"].min() mcards.append((dbc.CardImg(src = "assets/humidity_in.png", style = {"width": "50px"}), dbc.CardBody([html.P(f"Max: {vmax} %"), html.P(f"Min: {vmin} %")]))) values = get_and_merge_data("428F_94_temp", 24) vmax = values["val"].max() vmin = values["val"].min() mcards.append((dbc.CardImg(src = "assets/out_house.png", style = {"width": "50px"}), dbc.CardBody([html.P(f"Max: {vmax}\u00B0C"), html.P(f"Min: {vmin}\u00B0C")]))) values = get_and_merge_data("428F_94_hum", 24) vmax = values["val"].max() vmin = values["val"].min() mcards.append((dbc.CardImg(src = "assets/humidity_out.png", style = {"width": "50px"}), dbc.CardBody([html.P(f"Max: {vmax} %"), html.P(f"Min: {vmin} %")]))) return dbc.Row(dbc.CardDeck([dbc.Col(c, width = 5) for c in mcards], className = "weather"))
def create_headers(): headers = dbc.CardDeck([ dbc.Card( dbc.CardBody([ html.H5("Text Section 1", className="card-title"), html.P( "Some explanation about the housing data base.... " "bit longer than the second card.", className="card-text", ), dbc.Button("Click here", color="success", className="mt-auto"), ])), dbc.Card( dbc.CardBody([ html.H5("Text Section 2", className="card-title"), html.P( "Continue explanations for database...", className="card-text", ), dbc.Button("Click here", color="warning", className="mt-auto"), ])), dbc.Card( dbc.CardBody([ html.H5("Text Section 3", className="card-title"), html.P( "This card has some text content, which is longer " "than both of the other two cards, in order to " "demonstrate the equal height property of cards in a " "card group.", className="card-text", ), dbc.Button("Click here", color="danger", className="mt-auto"), ])), ]) return headers