'label': '2018', 'value': 2018 }, { 'label': '2019', 'value': 2019 }, { 'label': '2020', 'value': 2020 }], value=2018, # default value multi=False, ), html.Br(), dbc.Button(id='submit_button', n_clicks=0, children='Submit', color='primary', block=True), ]) sidebar = html.Div( [html.H2('Parameters', style=TEXT_STYLE), html.Hr(), controls], style=SIDEBAR_STYLE, ) content_first_row = dbc.Row([ dbc.Col(dbc.Card([ dbc.CardBody([ html.H4(id='card_title_1', children=['Card Title 1'],
def create_app_ui(): global project_name main_layout = dbc.Container(dbc.Jumbotron([ html.H2(id='heading', children= "Sentiments Analysis Using AI Based Text Analytics Techniques", className='display-6 mb-7'), html.Br(), html.Div([ html.Div([ dcc.RadioItems( id='reviewtype', options=[{ 'label': i, 'value': i } for i in ['balancedReviews', 'ScrappedReviews']], value='balancedReviews', labelStyle={ 'display': 'inline-block', 'margin-right': "20px" }) ], style={ 'width': '48%', 'display': 'inline-block' }), dcc.Graph(id='indicator-graphic') ]), html.Br(), dbc.Container([ dcc.Dropdown(id='dropdown', placeholder='Select a Review', options=[{ 'label': i[:100] + "...", 'value': i } for i in scrappedReviews.reviews], value=scrappedReviews.reviews[0], style={'margin-bottom': '30px'}) ], style={ 'padding-left': '50px', 'padding-right': '50px' }), html.Div(id='result'), html.Br(), dbc.Container([ dbc.Textarea(id='textarea', className="mb-3", placeholder="Enter the Review", value='Project is working well', style={'height': '100px'}), dbc.Button("Check", color="dark", className="mt-2 mb-3", id='button', style={'width': '100px'}), ], style={ 'padding-left': '50px', 'padding-right': '50px' }), html.Div(id='result1'), ], className='text-center'), className='mt-4') return main_layout
layout = html.Div( [ dcc.Store(id='new-memory'), navbar, # html.Iframe(src="https://www.youtube.com/embed/1CSeY10zbqo", # style={'width':560 , 'height': 315, 'frameborder': 0}), dbc.Row( [ dbc.Col([ dbc.Row( [ dbc.Alert("Please Select a Period", color="warning"), dbc.Button('update', id='update_dropdown_adjust', style={'display': 'none'}), dcc.Dropdown(id='month_selection_adjust', style={ 'width': '30vw', 'textAlign': 'center', 'margin': '0 auto', 'marginBottom': 10 }, options=directories_adjust()), html.A('Download 115 Alarms', id="download_btn_115", style={ 'backgroundColor': 'white', 'color': 'black', 'padding': '5px',
# https://dash-bootstrap-components.opensource.faculty.ai/docs/themes/ server = app.server app.title = 'nCov-19' app.layout = html.Div(children=[ html.H1(children='Covid-19 Interactive Tracker', style={'textAlign': 'center'}), html.Div(children='Data last updated: ' + time_series['Date'].max().strftime('%Y-%m-%d') + ' (Maintained by John Hopkins University)', style={'textAlign': 'center'}), html.Div( [ dcc.Location(id='url', refresh=False), dbc.Button(dcc.Link('Global', href='/page-1'), id="global-button", color='primary', className="mr-1"), dbc.Button(dcc.Link('Top', href='/page-2'), id="top-button", color='primary', className="mr-1"), dbc.Button(dcc.Link('Canada', href='/page-3'), id="canada-button", color='primary', className="mr-1"), html.Div(id='page-content'), #html.Span(id='button-container') ], style={ 'textAlign': 'center', 'width': '100%',
def capacity_template(client): """ The template for the capacity view. The phase selector is shown at the top, followed by the summarized data that answers the most important questions. Lastly there is a button that lets you open the more information panel. Args: client: Returns: html.Div: The capacity view. """ return html.Div( id=f"cookie-factory-{client}", children=[ dcc.Store(id=f"memory_phase_{client}", data="geulen"), dbc.Row( id=f"selection-menu-{client}", children=[ html.Div( className=f"container-display-{client}", id=f"capacity-phase-{client}", children=dbc.ButtonGroup([ dbc.Button( phase_data.get("name"), id=f"capacity-phase-{phase}-{client}", ) for phase, phase_data in config.capacity_phases.items() ]), ), html.Div( className="container-display", children=dcc.Dropdown( id=f"frequency-selector-{client}", options=[ { "label": "Week", "value": "week" }, { "label": "Maand", "value": "month" }, ], value="week", clearable=False, style={ "color": config.colors_vwt.get("darkgray"), "margin-left": "10px", "width": "150%", }, ), ), ], ), html.Div(id=f"capacity-indicators-{client}", ), dbc.Row( id=f"capacity-info-{client}", children=dbc.Col( [ dbc.Button( "Meer informatie", id=f"collapse-button-{client}", className="mb-3", style={ "background-color": config.colors_vwt["vwt_blue"] }, ), dbc.Collapse( [ dcc.Dropdown( id=f"unit-selector-{client}", options=[ { "label": "Percentage", "value": "" }, { "label": "Units", "value": "_units" }, ], value="_units", clearable=False, style={ "color": config.colors_vwt.get("darkgray"), "margin-left": "4px", "width": "100px", }, ), figure( graph_id=f"more-info-graph-{client}", figure=no_graph( title="Verdieping Capaciteit", text="Geen data...", ), ), ], id=f"more-info-collapse-{client}", ), ], width=12, ), ), ], )
id='data_C_source', options=[ {'label': 'Sample Datasets', 'value': 'sample'}, {'label': 'Personal Datasets', 'value': 'personal'} ], inputStyle={"margin-right": "20px", "margin-left": "20px"}, value='sample', labelStyle={'display': 'inline-block'} ), html.Div(id='data-C-selection'), dbc.Row([ dbc.Col(dbc.Button( dbc.Spinner(id="C1-spinners"), id="Compute1-button", className="mb-3", color="success", block=True)), dbc.Col(dbc.Button("Go To Next Step -- Preprocessing", id="Next1-button", className="mb-3", color="success", block=True, disabled=True)) ]) ]) ###### Data Selection @app.callback(
value= 'Star Wars: Episode IX - The Rise of Skywalker', placeholder='Search Movie', type='text', style={'width': '100%'}) ]), ], xs=12, sm=12, md=12, lg=4, xl=4, ), dbc.Col([ dbc.Button("Search for the Movie", color="primary", id="sbumit_buttom") ], xs=12, sm=12, md=12, lg=2, xl=2, style={ "margin-top": "10px", 'margin-left': '20px', }) ], justify="start") ], body=True,
def generate_layout(): """Generate dashboard layout""" return html.Div(children=[ dcc.Tabs([ dcc.Tab( label="Train AI", children=[ html.H1(children="AI learns snake"), html.Div([ html.Hr(), dbc.Row([ dbc.Col([ html.H3(children='Settings', style={'textAlign': 'left'}), html.P(children='Number of generations:', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Input(id='number_of_generations', value=400, type='number', style={ "margin": "5px", "width": "100%" }), html.P(children='Population_size:', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Input(id='population_size', value=1000, type='number', style={ "margin": "5px", "width": "100%" }), html.P(children='Survival percentage (%):', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Input(id='survival_perc', value=1, type='number', min=0, max=100, style={ "margin": "5px", "width": "100%" }), html.P(children='Parent percentage (%):', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Input(id='parent_perc', value=20, type='number', min=0, max=100, style={ "margin": "5px", "width": "100%" }), html.P(children='Mutation percentage (%):', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Input(id='mutation_perc', value=5, type='number', min=0, max=100, style={ "margin": "5px", "width": "100%" }), html.Div([ dbc.Button('Train AI', id="train_ai_button", color="primary", style={ "margin": "5px", "width": "100%" }), html.Div(id='train_ai_button_triggered', children=False), html.Div(id='output_folder', children=None, hidden=True) ]) ], width=2), dbc.Col([ dcc.Dropdown(id='metric_drop_down', value="score", clearable=False, options=[{ 'label': 'Fitness', 'value': 'fitness' }, { 'label': 'Score', 'value': 'score' }]) ], width=1), dbc.Col([ dcc.Graph(id='display'), dcc.Interval(id='interval', interval=1 * 1000, n_intervals=0) ]) ]) ]) ]), dcc.Tab(label='Snake AI', children=[ html.H1(children="AI plays snake"), html.Div([ html.Hr(), dbc.Row([ dbc.Col([ html.H3(children='Settings', style={'textAlign': 'left'}), html.P(children='Select training moment:', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Dropdown(id='session_selection', options=[{ 'label': 'Test', 'value': 'test_value' }]), html.P(children='Select generation', style={ 'textAlign': 'left', 'margin': '5px' }), dcc.Dropdown(id='generation_selection', options=[{ 'label': 'Test', 'value': 'test_value' }]), dcc.Interval(id='session_interval', interval=1 * 1000, n_intervals=0), html.Div([ dbc.Button('Play', id="play_ai_button", color="primary", style={ "margin": "5px", "width": "100%" }), dcc.Interval(id='snake_interval', interval=0.1 * 1000, n_intervals=0), html.Div(id='snake_location', children=None, hidden=True) ]) ], width=3), dbc.Col([ dcc.Graph(id='play_snake', figure=go.Figure(), config={'displayModeBar': False}) ]) ]) ]) ]) ]) ])
import dash import dash_bootstrap_components as dbc import dash_html_components as html import dash_core_components as dcc import plotly.express as px from dash.dependencies import Input, Output, State import pandas as pd df = pd.read_csv("Berlin_crimes.csv") app = dash.Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP ]) # https://bootswatch.com/default/ modal = html.Div([ dbc.Button("Add comment", id="open"), dbc.Modal( [ dbc.ModalHeader("All About Berlin"), dbc.ModalBody( dbc.Form( [ dbc.FormGroup( [ dbc.Label("Name", className="mr-2"), dbc.Input(type="text", placeholder="Enter your name"), ], className="mr-3", ), dbc.FormGroup(
placeholder=" days", value='5', style={ 'width': "50%", "margin-left": "5px", # 'marginRight': "10%", 'height': "32px" }) ]) ], width=3), dbc.Col([ html.Div([ dbc.Button(children="Apply", color="dark", size="sm", id="submit_btn", n_clicks=0) ]) ], width=2) ], justify="left", style={ 'marginLeft': "1%", 'marginRight': "1%", 'marginTop': 20 }), html.Br(), ################# Subsequent Rows: Display Outputs ######################### dbc.Row([
app.layout = html.Div([ html.Div( [html.Content(html.B('Code Chef Level 1'))], style={ 'padding': '20px 0px 5px 20px', 'background-color': 'bisque', 'font-size': '30px', 'text-align': 'center', 'color': 'darkslategray' }), html.Div( [ html.Div(dcc.Upload( id='files-upload', children=dbc.Button( 'Select TAB, WAX & Dataset Files', style={'background-color': 'darkslategray'}), multiple=True), style=buttonstyle), html.Div([ dbc.Button('Uploaded file list', id='open-file-list', style={'background-color': 'darkslategray'}), dbc.Modal([ dbc.ModalHeader('Uploaded files :'), dbc.ModalBody( html.Div(id='body-file-list', style={'padding': '20px 0px 5px 20px'})), dbc.ModalFooter( dbc.Button('Close', id='close-file-list',
The set consists of three elements. The first (and also the middle, if you look at the resulting whole plot) is the moving average (SMA) with a default value of 20. Two other components to the control lines, which are drawn below and superior. Lower band to SMA minus two standard deviations. Combined top band for SMA plus two standard deviations. There are opinions that the standard value deviation is 2.5 thanks to which 99% of the price action is between two ribbons, which means that the external injection becomes a very significant signal. """) ]) ]), dbc.Row([ html.H3("Selected companies:"), html.Div([ dbc.Button("WIG20", id="collapse-button", className="mb-3", color="primary"), dbc.Collapse(dbc.Card( dcc.Checklist( options=KmeanOptions().wig20_options_for_kmean(), value=[ d['value'] for d in KmeanOptions().wig20_options_for_kmean() if 'value' in d ], labelStyle={'display': 'block'})), id="collapse") ]), html.Div([ dbc.Button("mWIG40", id="collapse-button-mWIG40",
def generate_content_rows(): scenarioRows = [] resultRows = [] ivs = get_variable('interventions') scenario_id = get_variable('preset_scenario') for scenario in SCENARIOS: if scenario.id == scenario_id: break else: scenario = None if scenario is not None: scenarioRows.append( dbc.Row([ dbc.Col([ html.Strong(scenario.get_name() + ": "), html.Span(scenario.get_description()), ], className="mb-3") ])) scenarioRows.append( dbc.Button( '⚙ ' + _('Settings'), color="link", className="px-0 mb-1", id="settings-collapse-button", )) settingsTabs = dbc.Card([ dbc.CardHeader( dbc.Tabs( [ dbc.Tab(label=_("Events (%(num)s)", num=len(ivs)), tab_id="iv-tab"), dbc.Tab(label=_("Disease Parameters"), tab_id="param-tab"), dbc.Tab(label=_("Region Details"), tab_id="region-tab"), ], id="card-tabs", card=True, active_tab="iv-tab", )), dbc.CardBody(html.Div(id="card-content")), dbc.CardFooter([ html.Div(id='simulation-days-placeholder', style=dict(display='none')), dbc.Form([ dbc.FormGroup([ dbc.Label(_('Timeframe'), className="mr-3"), dcc.Dropdown( id='simulation-days-dropdown', options=[ dict(label=_('%(days)d days', days=x), value=x) for x in (45, 90, 180, 365, 730) ], value=get_variable('simulation_days'), searchable=False, clearable=False, style=dict(width='160px'), ) ], className="mr-3"), dbc.Button( _('Run simulation'), id='run-simulation', color='primary') ], inline=True) ]) ]) scenarioRows.append(dbc.Collapse(settingsTabs, id="settings-collapse")) scenarioRows.append(dbc.Row([dbc.Col(id='scenario-details')])) resultRows.append(html.H4(_('Outcome'), className="mb-3")) resultRows.append( dbc.Row([ dbc.Col([html.Div(id="simulation-results-container")]), ], className='mt-4')) resultRows.append( dbc.Row([dbc.Col([html.Div(id='day-details-container')])])) rows = [ html.Div(dbc.Container(scenarioRows), className="bg-gray-400 pb-4"), dbc.Container(resultRows, className="pt-4"), ] return rows
def render_iv_card(): ivs = interventions_to_rows() iv_table = dash_table.DataTable( id='interventions-table', data=ivs, columns=[ { 'name': _('Date'), 'id': 'date' }, { 'name': _('Event'), 'id': 'label' }, { 'name': _('Value'), 'id': 'value', 'editable': True }, { 'name': '', 'id': 'unit' }, ], style_cell={'textAlign': 'left'}, style_cell_conditional=[{ 'if': { 'column_id': 'value' }, 'textAlign': 'right' }], row_deletable=True, style_as_list_view=True, ) iv_card = dbc.CardBody([ html.Div([ dbc.Form([ html.Span(_('Add a new event: ')), dcc.DatePickerSingle( id='new-intervention-date', display_format='YYYY-MM-DD', first_day_of_week=1, className="mx-3", ), dcc.Dropdown( id='new-intervention-id', options=[{ 'label': i.label, 'value': i.name } for i in INTERVENTIONS], style=dict(width="450px"), ), dbc.Input( id='new-intervention-value', type='number', size='6', style=dict(width="100px"), className="mx-3", placeholder=_('value'), ), dbc.Button( _("Add"), id='new-intervention-add', color='primary'), ], inline=True), ], className="mb-3"), iv_table, html.Div(dbc.Button(_('Restore default events'), id='interventions-reset-defaults', color='secondary', size='sm', className='mt-3'), className='text-right'), ], className="px-5"), return iv_card
def make_vis_layout(network_df, enrichment_results, cyto_network, network_params): """Generates a custom layout depending on the network type.""" network_params = json.loads(network_params) # This filter is only used with RNASeq/Combined networks regulation_filter = html.Details( id='diff-exp-details', open=True, children=[ html.Summary('By differential expression'), dbc.Checklist( # ID type for pattern matching callback id={ 'type': 'filter', 'index': 3 }, options=[{ 'label': 'Up-Regulated', 'value': 'up' }, { 'label': 'Down-Regulated', 'value': 'down' }], value=[], ) ], ) # This filter is only used with Combined networks source_filter = html.Details( id='source-details', open=True, children=[ html.Summary('By experiment '), dbc.Checklist( # ID type for pattern matching callback id={ 'type': 'filter', 'index': 4 }, options=[{ 'label': 'RNA-Seq', 'value': 'RNASeq' }, { 'label': 'Tn-Seq', 'value': 'TnSeq' }], value=[], ) ], ) # These filters are used for all networks sidebar_filters = [ html.H5('Select nodes'), html.Details( open=True, children=[ html.Summary('By name'), dcc.Dropdown( # ID type for pattern-matching callback id={ 'type': 'filter', 'index': 0 }, # Allow search by both short name and locus tag (index) options=[{ 'label': term, 'value': term } for term in network_df['shortName']] + [{ 'label': term, 'value': term } for term in network_df.index], multi=True, optionHeight=50) ], ), html.Br(), html.Details( open=True, children=[ html.Summary('By localization '), dcc.Dropdown( # ID type for pattern-matching callback id={ 'type': 'filter', 'index': 1 }, options=[ dict(label=location, value=location) for location in network_df['localization'].unique() ], multi=True, ) ], ), html.Br(), html.Details( open=True, children=[ html.Summary('By enriched GO term'), dcc.Dropdown( # ID type for pattern-matching callback id={ 'type': 'filter', 'index': 2 }, # Use enriched GO terms as options. options=[{ 'label': term, 'value': term } for term in enrichment_results['name']], multi=True, optionHeight=50) ], ), html.Br() ] # Add extra filters for DE/Combined networks if network_params['type'] == 'rna_seq' or network_params[ 'type'] == 'combined': sidebar_filters.extend([regulation_filter, html.Br()]) if network_params['type'] == 'combined': sidebar_filters.extend([source_filter]) color_mapping = [html.Div(id='color-map'), html.Div(id='legend')] stylesheet = stylesheets.default # Add color mapping functionality for DE/Combined networks if network_params['type'] == 'gene_list': stylesheet = stylesheets.default elif network_params['type'] == 'rna_seq': color_mapping = [ html.H5('Color Mapping'), html.Div(id='color-map'), html.Div(style={'padding': '10px'}, children=html.Img(src=app.get_asset_url('de_legend.svg'), id='legend', width=100)) ] stylesheet = stylesheets.fold_change elif network_params['type'] == 'combined': color_mapping = [ html.H5('Color Mapping'), dbc.RadioItems( options=[{ 'label': 'Experiment', 'value': 'experiment' }, { 'label': 'Differential Expression', 'value': 'regulation' }], value='experiment', id='color-map', ), html.Div(style={'padding': '10px'}, children=html.Img(id='legend', width=100)) ] # Layout begins here return html.Div([ html.Div( style={ 'width': '24vw', 'backgroundColor': '#a6edff', 'padding': '10px', 'display': 'inline-block', 'height': 'calc(100vh - 65px)', 'vertical-align': 'top', 'overflow': 'auto' }, children=[ html.Div(color_mapping), # legend, dbc.Checklist(id='show-labels', options=[{ 'label': 'Show node labels', 'value': 1 }], switch=True, value=[]), html.Hr(), html.Div(id='full-network-panel', children=[ html.Div(id='node-filters', children=sidebar_filters), html.P(id='num-selected-nodes', style={'padding-top': '5px'}), dbc.Button('Make Sub-Network', id='make-subnetwork', color='primary', style={'display': 'none'}) ]), html.Div( id='subnetwork-btns', style={'display': 'none'}, children=[ dbc.Checklist(id='include-extra-genes', options=[{ 'label': 'Include additional genes', 'value': 1 }], switch=True, value=[]), html.Abbr( 'Help', title= (('Include additional genes, called Steiner nodes, that are are not ' 'included in the original data, but help connect other genes that are. ' 'Useful to connect subnetworks with ' 'many smaller components.')), ), html.Br(), dbc.Checklist( id='include-low-confidence', options=[{ 'label': 'Include low-confidence interactions', 'value': 1 }], switch=True, value=[]), html.Abbr( 'Help', title= (('Include all interactions in the subnetwork, instead of prioritizing ' 'experimental interactions.')), ), html.Br(), dbc.Button( 'Return to selection', id='reset-network', color='primary', ) ]), html.Hr(), dbc.DropdownMenu( id='download-dropdown', color='primary', style={'padding-top': '5px'}, label='Download', direction='right', children=[ dbc.DropdownMenuItem('Network (.graphml)', id='download-network'), dbc.DropdownMenuItem('Network Image (.png)', id='download-network-img'), dbc.DropdownMenuItem('Table (.csv)', id='download-table', style={'display': 'none'}) ]), Download(id='graphml-download'), Download(id='csv-download'), # Hidden Divs to store node details and subnetwork for download html.Div(id='filtered-node-details', style={'display': 'none'}), html.Div(id='hidden-subnetwork', style={'display': 'none'}) ], ), html.Div(style={ 'display': 'inline-block', 'width': '74vw' }, children=dbc.Container( fluid=True, children=[ dbc.Row([ dbc.Col(children=cyto.Cytoscape( id='main-view', style={ 'width': '100%', 'height': 'calc(100vh - 80px)' }, stylesheet=stylesheet, maxZoom=5, minZoom=0.3, zoom=1, layout={'name': 'preset'}, elements=cyto_network, boxSelectionEnabled=True)), ]), dbc.Row( dbc.Col( html.Div(id='node-details-table', style={'margin-top': '-25vh'}))) ])) ])
def card_main_volumn_based_measures(app): return dbc.Card(dbc.CardBody([ html.H1("Volume Based Measures", className="mb-3", style={"font-size": "1.5rem"}), html.Div( [ dbc.Button( "Edit Measures", id="button-add-measure", className="mb-3", style={ "background-color": "#38160f", "border": "none", "border-radius": "10rem", "font-family": "NotoSans-Regular", "font-size": "0.6rem" }, ), dbc.Popover( [ dbc.PopoverHeader("Eidt Measures"), dbc.PopoverBody([ html.Div([ dbc.Checklist( options=[ { 'label': "YTD Market Share %", 'value': "YTD Market Share %" }, { 'label': "Utilizer Count", 'value': "Utilizer Count" }, { 'label': "Avg Script (30-day adj) per Utilizer", 'value': "Avg Script (30-day adj) per Utilizer" }, { 'label': "Total Script Count (30-day adj) by Dosage (in thousand)", 'value': "Total Script Count (30-day adj) by Dosage (in thousand)" }, { 'label': "Total Units by Dosage (in thousand)", 'value': "Total Units by Dosage (in thousand)" }, ], value=[ "YTD Market Share %", "Utilizer Count", "Avg Script (30-day adj) per Utilizer" ], labelCheckedStyle={"color": "#057aff"}, id="checklist-add-measure", style={ "font-family": "NotoSans-Condensed", "font-size": "0.8rem", "padding": "1rem" }, ), ], style={ "padding-top": "0.5rem", "padding-bottom": "2rem" }), html.Div([ dbc.Button( "Comfirm", id="add-button-add-measure", className="mb-3", style={ "background-color": "#38160f", "border": "none", "border-radius": "10rem", "font-family": "NotoSans-Regular", "font-size": "0.6rem" }, ) ], style={"text-align": "center"}) ]), ], id="popover-add-measure", is_open=False, target="button-add-measure", placement="top", ), ], style={"text-align": "end"}, ), html.Div( [ card_sub1_volumn_based_measures(app, "YTD Market Share %", piechart_utilizer1, 'fig', 0.85), card_sub1_volumn_based_measures(app, "Utilizer Count", tbl_utilizer1, 'dash', 0.6), card_sub1_volumn_based_measures( app, "Avg Script (30-day adj) per Utilizer", bargraph_script_per_util, 'fig', 0.6), card_sub2_volumn_based_measures( app, "Total Script Count (30-day adj) by Dosage (in thousand)", bargraph_tot_script, bargraph_tot_script_split, 'fig', 'fig', 1, 1), card_sub2_volumn_based_measures( app, "Total Units by Dosage (in thousand)", bargraph_tot_unit, bargraph_tot_unit_split, 'fig', 'fig', 1, 1), ], className="mb-3", ), ]), style={ "box-shadow": "0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.05)", "border": "none", "border-radius": "0.5rem" })
import dash_bootstrap_components as dbc import dash_core_components as dcc import dash_html_components as html from dash.dependencies import Input, Output import plotly.express as px import plotly.graph_objects as go # Imports from this application from app import app # 2 column layout. 1st column width = 4/12 # https://dash-bootstrap-components.opensource.faculty.ai/l/components/layout column1 = dbc.Col( [ dcc.Markdown(""" ## Can we predict unemployment in the United States? How people decide upon their careers has always been a fascinating topic for me. More interesting though is how that decision, their ethnicity, education or even location impact employment. I welcomed the daunting task to predict employment status of an individual in the United States. """), dcc.Link(dbc.Button('Try it Out!', color='primary'), href='/predictions') ], md=4, ) column2 = dbc.Col([]) layout = dbc.Row([column1, column2])
def card_buttonGroup_domain_selected(app): return dbc.Card( dbc.CardBody( [ html.Div([ dbc.Button("Cost & Utilization Reduction", active=True, id="button-domain-1", outline=True, color="primary", className="mr-1", style={ "font-family": "NotoSans-Regular", "font-size": "0.8rem" }) ], id="buttonGroup-domain-selected-1", hidden=False), html.Div([ dbc.Button("Improving Disease Outcome", id="button-domain-2", outline=True, color="primary", className="mr-1", style={ "font-family": "NotoSans-Regular", "font-size": "0.8rem" }) ], id="buttonGroup-domain-selected-2", hidden=False), html.Div([ dbc.Button("Decreasing Health Disparities", id="button-domain-3", outline=True, color="primary", className="mr-1", style={ "font-family": "NotoSans-Regular", "font-size": "0.8rem" }) ], id="buttonGroup-domain-selected-3", hidden=True), html.Div([ dbc.Button("Increasing Patient Safety", id="button-domain-4", outline=True, color="primary", className="mr-1", style={ "font-family": "NotoSans-Regular", "font-size": "0.8rem" }) ], id="buttonGroup-domain-selected-4", hidden=True), html.Div([ dbc.Button("Enhancing Care Quality", id="button-domain-5", outline=True, color="primary", className="mr-1", style={ "font-family": "NotoSans-Regular", "font-size": "0.8rem" }) ], id="buttonGroup-domain-selected-5", hidden=True), html.Div([ dbc.Button("Better Patient Experience", id="button-domain-6", outline=True, color="primary", className="mr-1", style={ "font-family": "NotoSans-Regular", "font-size": "0.8rem" }) ], id="buttonGroup-domain-selected-6", hidden=True), ], style={ "display": "flex", "border": "none", "border-radius": "1rem", "padding": "0.2rem" }), )
dcc.Dropdown(id='oa_option', options=[{ 'label': k, 'value': k } for k in all_options.keys()], value='occupancies'), html.Hr(), dcc.Dropdown(id='oa_according_option'), html.Hr(id='start_end_receive'), ]), dbc.Row(children=[], id="label-card-container-1"), dcc.Input( id="label", type="text", placeholder='Activity Label'), html.Br(), dbc.Button("Submit Label", id="label-submit", color="info", className="mr-1"), ], style=styles['40vh']), dbc.Row([ html.H3("Video Feed from Selected Data"), html.Div([], id='selected-gif-container') ]), html.H2("Here are the Labels in the database:"), dbc.ListGroup(children=[], id="database-labels") ], md=4) ]) ] graph_select_form = dbc.Form([
app.layout = html.Div(children=[ dbc.Row( dbc.Col( html.H1("Marc Minvervini screener"), width={ 'size': 9, 'offset': 3 }, ), ), html.Br(), dbc.Row([ dbc.Button( f"Open {graph}", id=f"button-{graph}", className="mb-3", color="primary", ) for graph in ["previous", "portfolio"] ], justify="center"), html.Br(), #dbc.Row(dbc.Col(html.H2("Previous run"), # width={'size': 5, 'offset': 1},)), #dbc.Row(dbc.Col(html.Div(id='datatable'))), dbc.Row([ #dbc.Col(dbc.Collapse(get_previous_run(),id="collapse_datatable", is_open=False), width=5), dbc.Col( dbc.Collapse(dbc.Card(dbc.CardBody(get_previous_run()), color="primary", outline=True), id="collapse_datatable",
[ dbc.Col( [ html.H2("Heading"), html.P( """\ Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.""" ), dbc.Button("View details", color="secondary"), ], md=4, ), dbc.Col( [ html.H2("Graph"), dcc.Graph( figure={"data": [{"x": [1, 2, 3], "y": [1, 4, 9]}]} ), ] ), ] ) ], className="mt-4",
dbc.Row(html.Label("File name")), dbc.Row(dcc.Input(id='txt-filename', value='', type='text')) ], width=2), dbc.Col([ html.Label("Company Tickers"), dcc.Dropdown(id="dd-companyTicker", multi=True) ], width=2), dbc.Col([ html.Label("Company list"), dt.DataTable(data=[{}], id='dt-companyData'), html.Div(id='dt-companyDataContainer') ], width=4), dbc.Col(dbc.Button(id='btn-submit', n_clicks=0, children='Submit'), align='end') ], justify="center", style={'margin': 10}), dbc.Row([ html.Div(dt.DataTable(data=[{}], id='dt-fileData'), style={'display': 'none'}), html.Div(id='dt-fileData-container', style={'margin': 10}) ]), dcc.RadioItems(id="rb-action", options=[{ 'label': 'Process', 'value': 'Process' }, { 'label': 'Reprocess',
[ 'By signing up you accept our ', html.A('Terms Of Use', href='#') ], width={ 'size': 10, 'offset': 1 }, style={'text-align': 'center'} # 利用css设置文字居中 ), style={'margin': '6px'} # 利用css设置上下留白高度 ), dbc.Row( dbc.Col( # 利用css实现圆角矩形效果 dbc.Button( 'LOGIN', style={'border-radius': '18px'}, block=True), width={ 'size': 8, 'offset': 2 }, style={'text-align': 'center'})), dbc.Row([ dbc.Col(html.Hr()), html.P('or', style={ 'text-align': 'center', 'margin': 0 }), dbc.Col(html.Hr()) ]), dbc.Row( dbc.Col(dbc.Button('Signup using Google',
className= 'table my-0 div-for-table-alertas'), ], className='row mx-0', ), html.Div([ html.Div( id='count_entries-conc', className='col my-auto', ), html.Div( className= 'col my-auto buttons-footer-table', children=[ dbc.Button("Anterior", id='previous-page-conc', n_clicks=0, className='buttons-footer'), dbc.Button("Siguiente", id='next-page-conc', n_clicks=0, className='buttons-footer'), ], ), ], className='row mai-datatable-footer'), ], className='border-0', ), ], className='container', ),
[ dbc.CardBody([ dbc.Row([ html.H3(" Download Historic Data"), html.Br(), dcc.DatePickerRange( start_date_placeholder_text= "Start Period", end_date_placeholder_text= "End Period", calendar_orientation='horizontal', id="date_picker") ]), dbc.Row([ dbc.Button("Download", color="primary", id="download_button"), dbc.Toast( "start value is none", id="start_none", header="Start Values None", is_open=False, dismissable=True, icon="danger", # top: 66 positions the toast below the navbar style={ "position": "fixed", "top": 66, "right": 10, "width": 350 },
class Inicio: """ Clase con los componentes de la página de inicio de la aplicación """ cards = dbc.CardGroup([ dbc.Card( dbc.CardBody([ html.H5("Dash", className="card-title"), html.P( "Framework de código abierto desarrollado por Plotly en lenguaje Python" " para crear aplicaciones reactivas y analíticas basadas en la web." " Soportada sobre Flask.", className="card-text", ), dbc.Nav(dbc.NavLink(dbc.Button(children=[ html.Span([html.I(className="fa fa-link ml-2"), " Dash"]) ], color="primary"), href="https://dash.plotly.com/"), className="float-right") ])), dbc.Card( dbc.CardBody([ html.H5("MongoDB", className="card-title"), html.P( "Sistema de base de datos multiplataforma orientado a documentos," " de esquema libre. Estos documentos son almacenados en BSON, " "versión modificada de JSON que permite búsquedas rápidas de datos.", className="card-text", ), dbc.Nav(dbc.NavLink(dbc.Button(children=[ html.Span( [html.I(className="fa fa-database ml-2"), " PyMongo"]) ], color="primary"), href="https://pymongo.readthedocs.io/"), className="float-right") ])), dbc.Card( dbc.CardBody([ html.H5("WTdelineator", className="card-title"), html.P( "Módulo desarrollado en Python cuya función es calcular " "en qué puntos de la señal empiezan y/o terminan las diferentes " "ondas que componen un ECG, como por ejemplo, la onda P, onda T, y complejo QRS", className="card-text", ), dbc.Nav(dbc.NavLink( dbc.Button( children=[ html.Span( [ html.I(className="fa fa-code-fork ml-2"), " WTdelineator" ]) ], color="primary"), href="https://github.com/caledezma/WTdelineator"), className="float-right") ])), ]) card_img = dbc.Card([ dbc.CardImg(src="/src/assets/img_principal.png", top=True), ]) parte_img = dbc.Col([card_img]), body = dbc.Jumbotron([ dbc.Row([ dbc.Col([ html.H1("Visualiza y analiza ECG's con ECG App"), html.P( "Carga ficheros con distinto formato de almacenamiento de señal de ECG. " "Visualiza por intervalos la señal y las anotaciones sobre las ondas más importantes del ECG " "como la onda P, T y complejo QRS obtenidas de manera automática, además, edita " "las anotaciones del ECG por defecto.", className="lead", ), html.P("Crea una cuenta o inicia sesión para empezar."), html.Br(), html.P("Formatos soportados: Physionet, Ishne."), html.Hr(className="my-2"), dbc.Row([ dbc.Col([ dbc.Nav(dbc.NavLink( dbc.Button( children=[ html.Span( [ html. I(className="fa fa-code-fork ml-2" ), " Ver en GitHub" ]) ], color="primary"), href="https://github.com/crismartin/TFG"), className="float-right") ]) ]) ]), dbc.Col([ dbc.Card([ dbc.CardImg(src="/src/static/img_principal.png", top=True), ]) ]), ]) ]) footer = html.Footer([ dbc.Nav([ dbc.NavLink("© Universidad Rey Juan Carlos 2019-2020 "), dbc.NavLink(" | "), dbc.NavLink( "Escuela Técnica Superior de Ingeniería en Telecomunicación", href="https://www.urjc.es/etsit"), dbc.NavLink(" | "), dbc.NavLink("Protección de datos", href="https://www.urjc.es/proteccion-de-datos"), ]), ]) body = dbc.Container(children=[ html.Br(), body, html.H4("Tecnologías utilizadas"), cards, html.Br(), html.Br(), footer, html.Br() ]) @staticmethod def layout(): """ Devuelve la página de inicio de la aplicación """ return html.Div([Inicio.body])
def load_scenario_cards(url): """ Create and display html cards with scenario's kpi for the 15 first scenarios using cache file. """ cards_list = [] cards_count = 0 episode_graph_layout = { 'autosize': True, 'showlegend': False, 'xaxis': { 'showticklabels': False }, 'yaxis': { 'showticklabels': False }, 'margin': { 'l': 0, 'r': 0, 't': 0, 'b': 0 }, } is_episode_page = (url == "/" or url == "" or url == "/episodes") if cards_count < 15 and is_episode_page: for scenario in sorted(scenarios): best_agent_episode = make_episode(best_agents[scenario]['agent'], scenario) prod_share = EpisodeTrace.get_prod_share_trace(best_agent_episode) consumption = best_agent_episode.profile_traces cards_list.append( dbc.Col( lg=4, width=12, children=[ dbc.Card( className='mb-3', children=[ dbc.CardBody([ html.H5(className="card-title", children="Scenario {0}".format( scenario)), dbc.Row(children=[ dbc.Col( className="mb-4", children=[ html. P(className= "border-bottom h3 mb-0 text-right", children=best_agents[ scenario]['out_of']), html. P(className="text-muted", children="Agents on Scenario" ) ]), dbc.Col( className="mb-4", children=[ html. P(className= "border-bottom h3 mb-0 text-right", children='{}/{}'.format( best_agents[scenario] ['value'], meta_json[scenario] ['chronics_max_timestep'] )), html. P(className="text-muted", children="Agent's Survival") ]), dbc.Col( className="mb-4", children=[ html. P(className= "border-bottom h3 mb-0 text-right", children= f'{round(best_agents[scenario]["cum_reward"]):,}' ), html. P(className="text-muted", children="Cumulative Reward") ]), dbc.Col( className="mb-4", children=[ html. P(className= "border-bottom h3 mb-0 text-right", children='{} min'.format( round( best_agent_episode. total_maintenance_duration ))), html. P(className="text-muted", children= "Total Maintenance Duration") ]), ]), dbc.Row( className="align-items-center", children=[ dbc.Col( lg=4, width=12, children=[ html.H5( 'Production Share', className='text-center' ), dcc.Graph( style={ 'height': '150px' }, figure=go.Figure( layout= episode_graph_layout, data=prod_share, )) ]), dbc.Col( lg=8, width=12, children=[ html.H5( 'Consumption Profile', className='text-center' ), dcc.Graph( style={ 'height': '150px' }, figure=go.Figure( layout= episode_graph_layout, data=consumption)) ]) ]) ]), dbc.CardFooter( dbc.Button( "Open", id=scenario, key=scenario, className="btn-block", style={"background-color": "#2196F3"})) ]) ])) cards_count += 1 return cards_list
def charts_with_controls(charts, controls, layout): # -------------------------------------------------------------------------- # # -------------------------------------------------------------------------- #print(controls) #print(data) # -------------------------------------------------------------------------- # Create the chart objects # -------------------------------------------------------------------------- for chart in charts: thischart = charts[chart] details = charts[chart]['details'] if thischart['chart_type'] == 'bar': if 'color' in details: figure = generate_bar(data=details['data'], x=details['x'], y=details['y'], style=details['style'], color=details['color']) else: figure = generate_bar(data=details['data'], x=details['x'], y=details['y'], style=details['style']) if thischart['chart_type'] == 'line': figure = generate_line(details['data'], details['x'], details['y'], style=details['style']) charts[chart]['figure'] = dcc.Graph(id=charts[chart]['idx'], figure=figure) # -------------------------------------------------------------------------- # Create the matrix for the chart based on the shape input # -------------------------------------------------------------------------- chart_shape = shape_matrixify(layout['chart_shape']) # -------------------------------------------------------------------------- # Place into the appropriate shape # -------------------------------------------------------------------------- row = -1 numcols = len(chart_shape[0]) for col, chart in enumerate(charts): # ---------------------------------------------------------------------- # Figure out what column we should be in # ---------------------------------------------------------------------- thiscol = col % numcols # ---------------------------------------------------------------------- # Increment row if we're at the beginning of row # ---------------------------------------------------------------------- if thiscol == 0: row += 1 # ---------------------------------------------------------------------- # Place the object in # ---------------------------------------------------------------------- chart_shape[row][thiscol] = charts[chart]['figure'] # -------------------------------------------------------------------------- # Compile the components # -------------------------------------------------------------------------- chart_components = [] for row in chart_shape: rowinp = list(map(create_div_col, row)) thisrow = [] thisrow.append(get_empty_col()) thisrow.append(html.Div(dbc.Row(rowinp), className='col-10')) thisrow.append(get_empty_col()) chart_components.append(html.Div(thisrow, className='row')) chart_components.append(get_empty_row()) # -------------------------------------------------------------------------- # Create the control objects # -------------------------------------------------------------------------- for control in controls: # ---------------------------------------------------------------------- # Create a drop down # ---------------------------------------------------------------------- if controls[control]['control_type'] == 'dropdown': details = controls[control]['details'] controls[control]['obj'] = dcc.Dropdown( id=controls[control]['idx'], options=details['options'], value=details['value'], multi=details['multi'], style=details['style']) continue # ---------------------------------------------------------------------- # Button # ---------------------------------------------------------------------- if controls[control]['control_type'] == 'button': details = controls[control]['details'] controls[control]['obj'] = dbc.Button(details['label'], id=controls[control]['idx']) # controls[control]['obj'] = html.Button(details['label'],id=controls[control]['idx']) continue # ---------------------------------------------------------------------- # Add more as they come # ---------------------------------------------------------------------- # if controls[control]['control_type'] == # -------------------------------------------------------------------------- # Make components list # -------------------------------------------------------------------------- control_components = [] # -------------------------------------------------------------------------- # Go through each control and create a title + dropdown object # -------------------------------------------------------------------------- for control in controls: thiscontrolset = [] thiscontrolset.append(html.P(controls[control]['details']['title'])) thiscontrolset.append(controls[control]['obj']) control_components.append(dbc.Col(html.Div(thiscontrolset))) controlset = [ html.Div([ get_empty_col(), html.Div(dbc.Row(control_components), className='col-10'), get_empty_col() ], className='row') ] # -------------------------------------------------------------------------- # # -------------------------------------------------------------------------- if layout['controls_orient'] == 'top': construct = html.Div(controlset + chart_components, style=layout['style_default']) elif layout['controls_orient'] == 'bottom': construct = html.Div(chart_components + controlset, style=layout['style_default']) else: construct = html.Div(controlset + chart_components, style=layout['style_default']) # -------------------------------------------------------------------------- # Finish # -------------------------------------------------------------------------- return construct
[ dcc.Loading( id = 'loading-inputs', children = [ html.Div(id='store-df', style={'display' : 'none'}), html.Div(id='store-mcp', style={'display' : 'none'}), dbc.Container( [ html.H4(children='Inputs', className='display-5', style = {'fontSize': 36}), html.Hr(className='my-2'), html.Label('Select diagnostics file', className='lead'), dcc.Dropdown( id='file-drop', clearable=False, style = {'marginBottom': 10, 'fontSize': 14}, options=[{'label':i, 'value':i} for i in [f for f in os.listdir(path_d) if f.startswith('d_')]] ), dbc.Button('Import', id = 'import-btn', color = 'primary', className = 'mr-1', n_clicks = 0, disabled = True), html.Div(style = {'marginBottom':25}), html.Label('Select Destination Market', className='lead'), dcc.Dropdown( id ='baa-drop', clearable = False, style={'marginBottom': 25}, disabled = True ), html.Label('Select Period', className='lead'), dcc.Dropdown( id ='period-drop', clearable = False, style={'marginBottom': 0}, disabled = True, options = [{'label':i, 'value':i} for i in lst_periods] ) ], fluid = True ) ] )
def serve_layout(): # on reload get the latest data global gdl, spage, sreport, ppage, pplotpage gdl = GeneralDataLoader() spage = SitesPage() sreport = SiteReport() ppage = ProblematicPairsPage() pplotpage = PairPlotsPage() return html.Div([ dcc.Location(id='change-url', refresh=False), dcc.Store(id='store-dropdown'), dbc.Row([ dbc.Col( dbc.Button( "perfSONAR Toolkit Information", className="external-button", href='https://toolkitinfo.opensciencegrid.org/toolkitinfo/' )), dbc.Col( dbc.Button( "Kibana: Packet Loss in OSG/WLCG", className="external-button", href= 'https://atlas-kibana.mwt2.org/s/networking/app/kibana#/dashboard/07a03a80-beda-11e9-96c8-d543436ab024?_g=(filters%3A!()%2CrefreshInterval%3A(pause%3A!t%2Cvalue%3A0)%2Ctime%3A(from%3Anow-3d%2Cto%3Anow))' )), dbc.Col( dbc.Button( "Kibana: Packet Loss Tracking", className="external-button", href= 'https://atlas-kibana.mwt2.org/s/networking/app/dashboards#/view/ab7c4950-5cfa-11ea-bad0-ff3d06e7229e?_g=(filters:!(),refreshInterval:(pause:!t,value:0),time:(from:now-3d,to:now))' )), dbc.Col( dbc.Button("MEPHi Tracer: Traceroute explorer", className="external-button", href='https://perfsonar.uc.ssl-hep.org')) ], className="external-links", justify='center', align="center", no_gutters=True), dbc.Nav([ dbc.NavItem( dbc.NavLink(html.Img(src=app.get_asset_url('ps-dash.png'), height="35px"), disabled=True, href="/sites", className="logo")), dbc.NavItem(dbc.NavLink("SITES", href="/sites", id='sites-tab')), dbc.NavItem(dbc.NavLink("LINKS", href="/nodes", id='nodes-tab')), dbc.NavItem(dbc.NavLink("PLOTS", href="/pairs", id='pairs-tab')), ], fill=True, justified=True, id='navbar'), dcc.Loading(html.Div(id='page-content'), className='loader-cont', color='#00245A'), html.Div(id='page-content-noloading'), ], className='main-cont')