import dash_html_components as html import dash_core_components as dcc app = dash.Dash(__name__) app.layout = html.Div([ dcc.Input(id='input'), dcc.Dropdown(id='dropdown', options=[{ 'label': str(x), 'value': str(x) } for x in range(1, 10)]), dcc.RadioItems(id='radio-items', options=[{ 'label': str(x), 'value': str(x) } for x in range(1, 10)]), html.Div(id='input-output'), html.Div(id='dropdown-output'), html.Div(id='radio-items-output'), html.Button('change-style', id='change-style'), html.Div('Style changer', id='style-output', style={'backgroundColor': 'rgba(255, 0, 0, 1)'}), html.Div(id='multi-elements-click', children=[ html.Button('btn-1', id='btn-1'), html.Button('btn-2', id='btn-2'), html.Button('btn-3', id='btn-3'), ]),
available_indicators = df['Indicator Name'].unique() app.layout = html.Div([ html.Div( [ html.Div([ dcc.Dropdown(id='crossfilter-xaxis-column', options=[{ 'label': i, 'value': i } for i in available_indicators], value='Total employed (in persons X 1000)'), dcc.RadioItems(id='crossfilter-xaxis-type', options=[{ 'label': i, 'value': i } for i in ['Linear', 'Log']], value='Linear', labelStyle={'display': 'inline-block'}) ], style={ 'width': '49%', 'display': 'inline-block' }), html.Div([ dcc.Dropdown(id='crossfilter-yaxis-column', options=[{ 'label': i, 'value': i } for i in available_indicators], value='Average hourly wage rate in C$'),
html.Br(), html.P('Select the most important subject for this bill:'), dcc.Dropdown(id='submitted-bill-subject', options=[{ 'label': i, 'value': i } for i in available_subjects]), html.Br(), html.P('Which chamber are you in?'), dcc.RadioItems(id='chamber-radio', options=[{ 'label': 'House of Representatives', 'value': 'house' }, { 'label': 'Senate', 'value': 'senate' }], value='senate', labelStyle={ 'display': 'inline-block', 'margin-right': '2%' }), html.Br(), html.P('Which party are you in?'), dcc.RadioItems(id='sponsor-party-radio', options=[{ 'label': 'Democrat', 'value': 'Democrat' }, { 'label': 'Republican', 'value': 'Republican'
available_countries = df['GEO'].unique() available_units = df["UNIT"].unique() app.layout = html.Div([ html.H2('Final Assignment Rico Dähler',style={'textAlign': 'center', 'color': 'purple'}), html.H4('Figure 1',style={'textAlign': 'center'}), html.Div([ html.Div([ html.Label('Select Indicator'), dcc.Dropdown( id='xaxis-column', options=[{'label': i, 'value': i} for i in available_indicators], value='Gross domestic product at market prices' ), dcc.RadioItems( id='Select_Unit', options=[{'label': i, 'value': i} for i in available_units], value='Current prices, million euro') ], style={'width': '48%', 'display': 'inline-block'}), html.Div([ html.Label('Select Indicator'), dcc.Dropdown( id='yaxis-column', options=[{'label': i, 'value': i} for i in available_indicators], value='Final consumption expenditure' ) ],style={'width': '48%', 'float': 'right', 'display': 'inline-block'}) ]), dcc.Graph(id='indicator-graphic'), #this is the graph figure dcc.Slider(
html.Div(id='body') ]) @app.callback(Output('body', 'children'), [Input('navigation-links', 'value')]) def display_children(chapter): if chapter == 'Chapter 1': return Div('Welcome to Chapter 1') elif chapter == 'Chapter 2': return Div('Welcome to Chapter 2') ''', language='python', customStyle=styles.code_container), html.Div([ dcc.RadioItems(options=[{ 'label': i, 'value': i } for i in ['Chapter 1', 'Chapter 2']], value='Chapter 1', id='navigation-links-urls'), html.Div(id='body-urls') ], id='urls-example', className="example-container"), dcc.Markdown(''' Hiding and showing children like this gives the effect of navigating to new pages. The second part of navigation is updating the browser's navigation bar with a new URL and loading the correct children when the user navigates to a particular URL pathname. Dash supports URLs like this by mapping values in the application's state
html.Br(), html.Br(), daq.Slider( id="input-qsec", min=np.floor(mtcars["qsec"].min()), max=np.ceil(mtcars["qsec"].max()), dots=False, handleLabel={"showCurrentValue": True, "label": "Value"}, step=0.25, value=np.floor(mtcars["qsec"].mean()), ), html.H5("Number of cylinders:"), html.Br(), dcc.RadioItems( id="input-cyl", options=opts_cyl, value=opts_cyl[0].get("value"), labelStyle={"display": "inline-block"}, ), html.Br(), daq.BooleanSwitch( id="input-am", label="Has manual transmission", on=True, style={"display": "inline-block"}, ), html.H2(id="output-prediction"), html.Br(), dcc.Dropdown( id="my-dropdown", options=[ {"label": "Linear", "value": "LINEAR"},
marks={ i: ' ' if i % 50 else '{}'.format(i) for i in range(0, 251) }, value=currdata['num_facilities'][0], id='num_facilities_slider') ]), # has_us_facility html.Div(children=[ html.Label('Will you have facilities in the US?'), dcc.RadioItems(options=[{ 'label': 'Yes', 'value': True }, { 'label': 'No', 'value': False }], value=currdata['has_us_facility'][0], id='has_us_facility_radio') ], id='has_us_facility', style={ 'margin-top': 30, 'margin-bottom': 10 }), # is_cancer html.Div(children=[ html.Label( 'Does your study deal with any form of cancer?'),
'label': 'Краснодарский край', 'value': 'MTL' }, { 'label': 'Республика Татарстан', 'value': 'SF' }], value=['MTL', 'SF'], style={"width": 310}, ), html.Label('Сумма уплаченного налога:'), dcc.RadioItems(options=[ { 'label': 'Рассчитать сумму уплаченного налога', 'value': 'NYC' }, { 'label': 'Укажете самостоятельно сумму налога', 'value': 'MTL' }, ], value='MTL'), dcc.Input(type='text', placeholder='Укажите свой доход', style={"width": 310}), dcc.Graph(id='2', figure=fig1) ] #, style={'columnCount': 2} ) if __name__ == '__main__': app.run_server(debug=True)
], className="page") #Page 2 granting = html.Div([ # page 3 print_button(), html.Div([ get_menu(), # Row `` html.Div([ get_graph1(name='vintage-global',height=250,jump='All segments'), get_graph_with_dropdown(name='vintage-segment',height=250,dropdown=['Auto','Retail']), ], className="row "), html.Div([ dcc.RadioItems(id='id-prod-or-fpd', options=[{'label': i, 'value': i} for i in ['Production','FPD']], value='Production', labelStyle={'display': 'inline-block'} ) ], className="row "), html.Div([ get_graph1('prod-fpd-global',250), get_graph1('prod-fpd-segment',250) ], className="row "), html.Div([ get_graph1('id-prod-country',250), get_graph1('id-prod-segment',250) ], className="row "), ], className="subpage") ], className="page") vintages = html.Div([ # page 3
value=5, ), html.Div( id="shrinking-container", children=[ html.P(children="Shrinking"), dcc.RadioItems( id= "radio-svm-parameter-shrinking", labelStyle={ "margin-right": "7px", "display": "inline-block", }, options=[ { "label": " Enabled", "value": "True", }, { "label": " Disabled", "value": "False", }, ], value="True", ), ], ), ], ), ], ),
def start_dash_app(logfile): app = dash.Dash(__name__) app.title = "ctffindplot" app.layout = html.Div(children=[ html.H1(children="ctffindplot"), html.Div(children=logfile), dcc.RadioItems( id="set-refresh", value=10 * 1000, options=[ { "label": "Auto-refresh every 10 seconds", "value": 10 * 1000 }, { "label": "Off", "value": 2**30 }, ], ), html.Div( id="graphs", children=[], ), dcc.Interval( id="interval-component", interval=10 * 1000, n_intervals=0, # in milliseconds ), ]) @app.callback( dash.dependencies.Output("interval-component", "interval"), [dash.dependencies.Input("set-refresh", "value")], ) def update_interval(value): return value @app.callback( Output("graphs", "children"), [Input("interval-component", "n_intervals")], ) def update_graphs(_): ctfdata = read_csv(logfile) xaxis_view_width = 500 n = len(ctfdata["index"]) if n > xaxis_view_width: xaxis = dict(range=[n - xaxis_view_width, n]) else: xaxis = dict(range=[0, n]) updated_graphs = [ dcc.Graph( style={"height": 300}, id="defocus", figure=dict( data=[ dict(name="defocus1", x=ctfdata["index"], y=ctfdata["defocus1"]), dict( name="defocus2", x=ctfdata["index"], y=ctfdata["defocus2"], ), ], layout=dict( title="Defocus 1 and 2, um", showlegend=True, legend=dict(x=0, y=1.0), margin=dict(l=40, r=10, t=60, b=30), yaxis=dict(range=[0, 4]), xaxis=xaxis, ), ), ), dcc.Graph( style={"height": 300}, id="astig", figure=dict( data=[ dict( x=ctfdata["index"], y=ctfdata["astig"], ), ], layout=dict( title= "Amount of Astigmatism = abs(defocus1 - defocus2), nm", margin=dict(l=40, r=10, t=60, b=30), yaxis=dict(range=[0, 200]), xaxis=xaxis, ), ), ), dcc.Graph( style={"height": 300}, id="azimuth_astig", figure=dict( data=[ dict( x=ctfdata["index"], y=ctfdata["azimuth_astig"], ), ], layout=dict( title="Azimuth of Astigmatism", margin=dict(l=40, r=10, t=60, b=30), xaxis=xaxis, ), ), ), dcc.Graph( style={"height": 300}, id="phase_shift", figure=dict( data=[ dict( x=ctfdata["index"], y=ctfdata["phase_shift"], ), ], layout=dict( title="Phase Shift, Degrees", margin=dict(l=40, r=10, t=60, b=30), yaxis=dict(range=[-20, 100]), xaxis=xaxis, ), ), ), dcc.Graph( style={"height": 300}, id="xcorr", figure=dict( data=[ dict( x=ctfdata["index"], y=ctfdata["xcorr"], ), ], layout=dict( title="Cross Correlation", margin=dict(l=40, r=10, t=60, b=30), xaxis=xaxis, ), ), ), dcc.Graph( style={"height": 300}, id="res_fit", figure=dict( data=[ dict( x=ctfdata["index"], y=ctfdata["res_fit"], ), ], layout=dict( title="Resolution of Fit, A", margin=dict(l=40, r=10, t=60, b=30), yaxis=dict(range=[0, 10]), xaxis=xaxis, ), ), ), ] return updated_graphs app.run_server(debug=False)
html.Div([ html.Label(f'{s}-{v}: ', style={ 'display': 'inline', 'fontSize': 15 }), dcc.RadioItems(id=f'radiolist-{s}', options=[ { "label": "Dem", "value": "democrat" }, { "label": "Rep", "value": "republican" }, { "label": "NA", "value": "unsure" }, ], value='unsure', inputStyle={'margin-left': '10px'}, labelStyle={'display': 'inline-block'}, style={'display': 'inline'}), ], style={'textAlign': 'end'})) print(radio_list) # Input list for the callback (long_code.py lines 48-52) input_list = []
import dash_core_components as dcc import dash_html_components as html import plotly.graph_objects as go from dash.dependencies import Input, Output external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css'] app = dash.Dash(__name__, external_stylesheets=external_stylesheets) app.layout = html.Div([ dcc.RadioItems( id='radio-1', options=[ {'label': 'Polska', 'value':'Polska'}, {'label': 'Stany Zjednoczone', 'value':'Stany Zjednoczone'} ], value='Polska' ), html.Hr(), dcc.RadioItems( id='radio-2' ), html.Hr(), html.Div(id='div-1') ]) @app.callback( Output(component_id='radio-2', component_property='options'), [Input(component_id='radio-1', component_property='value')]
html.Label('Range Slider'), dcc.RangeSlider(id='rangeslider', marks={i: 'Label {}'.format(i) for i in range(0, 9)}, min=0, max=9, value=[0, 1], step=1), html.Br(), html.Hr(), html.Label('Text Area'), dcc.Textarea(id='textarea', placeholder='Enter a value...', value='This is a TextArea component'), html.Br(), html.Hr(), html.Label('Date Picker Single'), dcc.DatePickerSingle(id='date-picker-single', date=dt(2019, 6, 12)), html.Br(), html.Hr(), html.Label('Radio Items'), dcc.RadioItems(id='radio', options=options, value='PT'), html.Br(), html.Hr(), html.Label('Checkboxes'), dcc.Checklist(id='checkbox', options=options, value=['PT', 'FR']) ]) if __name__ == '__main__': app.run_server(debug=True)
id='year_slider', min=1960, max=2017, value=[1990, 2010], className="dcc_control" ), html.P( 'Filter by well status:', className="control_label" ), dcc.RadioItems( id='well_status_selector', options=[ {'label': 'All ', 'value': 'all'}, {'label': 'Active only ', 'value': 'active'}, {'label': 'Customize ', 'value': 'custom'} ], value='active', labelStyle={'display': 'inline-block'}, className="dcc_control" ), dcc.Dropdown( id='well_statuses', options=well_status_options, multi=True, value=list(WELL_STATUSES.keys()), className="dcc_control" ), dcc.Checklist( id='lock_selector', options=[
html.H1(children='COVID-19', style={ 'textAlign': 'center', 'color': colors['text'] }), html.Div(children='Select focus for the dashboard', style={ 'textAlign': 'center', 'color': colors['text'] }), html.Div(dcc.RadioItems( id='global_format', options=[{ 'label': i, 'value': i } for i in ['Worldwide', 'United States', 'Europe']], value='Worldwide', labelStyle={ 'float': 'center', 'display': 'inline-block' }), style={ 'textAlign': 'center', 'color': colors['text'], 'width': '100%', 'float': 'center', 'display': 'inline-block' }), html.Div(dcc.Graph(id='confirmed_ind'), style={ 'textAlign': 'center',
}, { 'label': u'Montréal', 'value': 'MTL' }, { 'label': 'San Francisco', 'value': 'SF' }], value=['MTL', 'SF'], multi=True), html.Label('Radio Items'), dcc.RadioItems(options=[{ 'label': 'New York City', 'value': 'NYC' }, { 'label': u'Montréal', 'value': 'MTL' }, { 'label': 'San Francisco', 'value': 'SF' }], value='MTL'), html.Label('Checkboxes'), dcc.Checklist(options=[{ 'label': 'New York City', 'value': 'NYC' }, { 'label': u'Montréal', 'value': 'MTL' }, { 'label': 'San Francisco', 'value': 'SF'
app.layout = html.Div([ html.Div([ dbc.Jumbotron([ html.H1("Unsupervised Clustering of Vowels", className="display-3"), html.H2( "Insert your vowel's dataset and perform clustering", className="lead", ) ]) ]), html.H5("Choose two different columns:"), html.Div([ dcc.RadioItems(id="column1", options=columns, value='F1', labelStyle={'display': 'inline-block'}) ]), html.Div([ dcc.RadioItems(id="column2", options=columns, value='F2', labelStyle={'display': 'inline-block'}) ]), html.H5("Choose a model:", style={"margin-top": 50}), html.Div([ dcc.RadioItems(id="model-type", options=models, value='DBSCAN', labelStyle={'display': 'inline-block'}), html.Div(id='output-params')
], className="mt-1 mb-2"), dbc.Col([ dbc.Row([ dbc.Card([ dbc.CardBody([ html.H3(id='recomend one'), html.H3(id='recomend estimation'), html.H3(id='recomend real'), html.P(id='recomend bid'), dcc.RadioItems(options=[{ 'label': 'Similaridad mixto (reseña + ctas)', 'value': 1 }, { 'label': 'Similaridad basado en reseña', 'value': 2 }, { 'label': 'Similaridad basado en características', 'value': 3 }], value=1, id='recomend similar model') ]) ]) ]) ], className="mt-1 mb-2"), dbc.Row([ dbc.Col([ dbc.Card([ dbc.CardBody([ dash_table.DataTable(
href='https://github.com/pcm-dpc/COVID-19'), '.', html.Br(), 'Il codice è open source sotto licenza MIT e disponibile su ', html.A( 'github', href='https://github.com/doppioandante/covid_andamento_regionale'), '.' ]), html.Div(f''' Ultimo aggiornamento: {last_update} '''), dcc.RadioItems(id='plot-type', options=[{ 'label': i, 'value': i } for i in [ 'Confronto Regioni', 'Dettaglio Regione', 'Dettaglio Province per Regione' ]], value='Confronto Regioni', labelStyle={'display': 'inline-block'}), dcc.Dropdown(id='plot-variable'), dcc.Graph(id='trend-plot', config=dict(locale='it')) ]) @app.callback(Output('plot-variable', 'options'), [Input('plot-type', 'value')]) def set_dropdown_options(plot_type): if plot_type == 'Confronto Regioni': return [{ 'label': label,
'label': 'Life Expectancy', 'value': 'lifeExp' }, { 'label': 'GDP per Capita', 'value': 'gdpPercap' }], value='pop'), 'Country', dcc.Dropdown(id='clientside-graph-country-px', options=[{ 'label': country, 'value': country } for country in available_countries], value='Canada'), 'Graph scale', dcc.RadioItems(id='clientside-graph-scale-px', options=[{ 'label': x, 'value': x } for x in ['linear', 'log']], value='linear'), html.Hr(), html.Details([ html.Summary('Contents of figure storage'), dcc.Markdown(id='clientside-figure-json-px') ]) ]) @app.callback(Output('clientside-figure-store-px', 'data'), [ Input('clientside-graph-indicator-px', 'value'), Input('clientside-graph-country-px', 'value') ]) def update_store_data(indicator, country):
max=2017, value=[1990, 2010], className="dcc_control", ), html.P("Filter by well status:", className="control_label"), dcc.RadioItems( id="well_status_selector", options=[ { "label": "All ", "value": "all" }, { "label": "Active only ", "value": "active" }, { "label": "Customize ", "value": "custom" }, ], value="active", labelStyle={"display": "inline-block"}, className="dcc_control", ), dcc.Dropdown( id="well_statuses", options=well_status_options, multi=True, value=list(WELL_STATUSES.keys()), className="dcc_control",
def __init__(self, data_acquisitor): self.app = web_gui.APP self.data_acquisitor = data_acquisitor self.title = html.H3('NetFlow Preprocessor', style={'margin-bottom': '0px'}) self.info = html.Div(id=uuid4().hex, className=cnf.GUI.CLASS_SMALL_TEXT) self.pause = html.Hr(className=cnf.GUI.CLASS_PAUSE) self.t1 = html.Div('Here you can select features to be extracted:', className=cnf.GUI.CLASS_TEXT) self.selector_variables = dcc.Checklist( id=uuid4().hex, options=[{ 'label': ' '.join(k.lower().split('_')), 'value': k } for k in list(self.data_acquisitor.variables.keys())], values=[ 'FIRST SEEN', 'SOURCE ADDRESS', 'DESTINATION ADDRESS', 'SOURCE PORT', 'DESTINATION PORT', 'PACKETS' ], labelStyle={'display': 'block'}, inputStyle={'margin': '5px'}, style={'color': cnf.GUI.COLORMAP['font-secondary']}) self.t8 = html.Div( 'Here you can select statistics that you want to include in data:', className=cnf.GUI.CLASS_TEXT) self.selector_statistics = dcc.Checklist( id=uuid4().hex, options=[{ 'label': ' '.join(k.lower().split('_')), 'value': k } for k in list(self.data_acquisitor.statistics.keys())], values=['MIN', 'MAX'], labelStyle={'display': 'block'}, inputStyle={'margin': '5px'}, style={'color': cnf.GUI.COLORMAP['font-secondary']}) self.t2 = html.Div('Here you can choose flows aggregators:', className=cnf.GUI.CLASS_TEXT) self.selector_aggregators = dcc.Checklist( id=uuid4().hex, options=[{ 'label': ' '.join(k.lower().split('_')), 'value': k } for k in list(self.data_acquisitor.aggregators.keys())], values=['DESTINATION ADDRESS'], labelStyle={'display': 'block'}, inputStyle={'margin': '5px'}, style={ 'color': cnf.GUI.COLORMAP['font-secondary'], 'margin-bottom': '20px' }) self.t3 = html.Div('And traffic volume unit:', className=cnf.GUI.CLASS_TEXT) self.selector_unit = dcc.RadioItems( id=uuid4().hex, options=[{ 'label': k.lower(), 'value': k } for k in list(self.data_acquisitor.unit.keys())], value='FLOWS', labelStyle={'display': 'block'}, inputStyle={'margin': '5px'}, style={'color': cnf.GUI.COLORMAP['font-secondary']}) self.t4 = html.Div('Here you are able to define filters:') self.filter_protocol = dcc.Input(id='PROTOCOL', type='text', value='') self.filter_ip_version = dcc.Input(id='IP VERSION', type='text', value='') self.filter_source_address = dcc.Input(id='SOURCE ADDRESS', type='text', value='') self.filter_destination_address = dcc.Input(id='DESTINATION ADDRESS', type='text', value='') self.filter_source_port = dcc.Input(id='SOURCE PORT', type='text', value='') self.filter_destination_port = dcc.Input(id='DESTINATION PORT', type='text', value='') self.filter_tcp_flags = dcc.Input(id='TCP FLAGS', type='text', value='') self.filter_packets = dcc.Input(id='PACKETS', type='text', value='') self.filter_bytes = dcc.Input(id='BYTES', type='text', value='') self.filter_flows = dcc.Input(id='FLOWS', type='text', value='') self.filter_duration = dcc.Input(id='DURATION', type='text', value='') self.filters = [ self.filter_protocol, self.filter_ip_version, self.filter_source_address, self.filter_destination_address, self.filter_source_port, self.filter_destination_port, self.filter_tcp_flags, self.filter_packets, self.filter_bytes, self.filter_flows, self.filter_duration ] self.selector_filters = html.Div( id=uuid4().hex, children=[ html.Div( [ html.Div(' '.join(k.lower().split('_')) + ':', style={'text-align': 'right'}), self.filters[i] ], style={ 'display': 'grid', 'grid-template-columns': '30% 50%', 'align-items': 'center', 'grid-gap': '20px', 'color': cnf.GUI.COLORMAP['font-secondary'] }) for i, k in enumerate( list(self.data_acquisitor.filters.keys())) ], style={'margin': '10px'}) self.selector = html.Div([ html.Div( [ html.Div([self.t1, self.selector_variables]), html.Div([self.t8, self.selector_statistics]), html.Div([ self.t2, self.selector_aggregators, self.t3, self.selector_unit ]) ], style={ 'display': 'grid', 'grid-template-columns': '33% 33% 33%', 'align-items': 'top', 'grid-gap': '20px' }), self.pause, html.Div([self.t4, self.selector_filters]) ]) self.my_query = html.Div(id=uuid4().hex, className=cnf.GUI.CLASS_SMALL_TEXT) self.data_filename = dcc.Input( id=uuid4().hex, placeholder= 'Podaj nazwę, pod którą chcesz zapisać strukturę danych...', type='text', value='') self.button_build_query = html.Button(id=uuid4().hex, children='Generate query', className=cnf.GUI.CLASS_BUTTON) self.button_get_data = html.Button(id=uuid4().hex, children='Get data', className=cnf.GUI.CLASS_BUTTON) self.da_timer = html.Div(id=uuid4().hex, children='', className=cnf.GUI.CLASS_TEXT) self.section_query = html.Div( [self.button_build_query, self.button_get_data], style={ 'display': 'grid', 'grid-template-columns': '50% 50%', 'align-items': 'top', 'justify-items': 'center' }) self.t5 = html.Div( 'Here you are able to select the time window size for sampling nfdump binary...', className=cnf.GUI.CLASS_TEXT) self.time_window_selector = dcc.Slider( id=uuid4().hex, min=cnf.NFDUMP.TIME_WINDOW_MIN, max=cnf.NFDUMP.TIME_WINDOW_MAX, step=cnf.NFDUMP.TIME_WINDOW_STEP, marks={ i: { 'label': str(i) + ' min', 'style': { 'color': cnf.GUI.COLORMAP['font-main'], 'font-size': '10', 'transform': 'rotate(-45deg)', 'transform-origin': '50% 170%' } } for i in cnf.NFDUMP.TIME_WINDOW_MARKS }, value=cnf.NFDUMP.TIME_WINDOW) self.time_window_selector_packed = html.Div( self.time_window_selector, className=cnf.GUI.CLASS_SLIDER) self.t6 = html.Div( '... and here the time delta size for sampling nfdump binary.', className=cnf.GUI.CLASS_TEXT) self.time_window_delta_selector = dcc.Slider( id=uuid4().hex, min=cnf.NFDUMP.TIME_WINDOW_DELTA_MIN, max=cnf.NFDUMP.TIME_WINDOW_DELTA_MAX, step=cnf.NFDUMP.TIME_WINDOW_DELTA_STEP, marks={ i: { 'label': str(i) + ' s', 'style': { 'color': cnf.GUI.COLORMAP['font-main'], 'font-size': '10', 'transform': 'rotate(-45deg)', 'transform-origin': '50% 170%' } } for i in cnf.NFDUMP.TIME_WINDOW_DELTA_MARKS }, value=cnf.NFDUMP.TIME_WINDOW_DELTA) self.time_window_delta_selector_packed = html.Div( self.time_window_delta_selector, className=cnf.GUI.CLASS_SLIDER) self.t7 = html.Div(id=uuid4().hex, className=cnf.GUI.CLASS_SMALL_TEXT) self.section_time_window = html.Div([ self.t5, self.time_window_selector_packed, self.t6, self.time_window_delta_selector_packed, self.t7 ]) self.dropdown_anomaly = dcc.Dropdown( id=uuid4().hex, options=[{ 'label': anomaly, 'value': anomaly } for anomaly in cnf.DETECTOR.ANOMALIES], placeholder='No anomaly type was chosen...') self.dropdown_anomaly_packed = html.Div( self.dropdown_anomaly, className=cnf.GUI.CLASS_DROPDOWN) self.section_anomaly = html.Div( [self.dropdown_anomaly_packed, self.button_get_data], className=cnf.GUI.CLASS_GRID_20) self.layout = html.Div([ self.title, self.info, self.pause, self.selector, self.my_query, self.data_filename, self.section_query, self.da_timer, self.pause, self.section_time_window, self.pause ], id='data-acquisitor', className=cnf.GUI.CLASS_MODULE, style={'hidden': True})
size=12, ), Col( [ html.Label('Number of Players', style={'margin': '5px'}), dcc.Input( id='nrows-input', type='number', value=20), dcc.RadioItems( id='count-method-radioitems', options=[ { 'label': 'Total', 'value': 'total' }, { 'label': 'Per Position', 'value': 'per-position' }, ], value='per-position', labelStyle={'margin': '5px'}, ), html.Label('Drafted/Unavailable Players:', style={'margin': '5px'}), dcc.Dropdown( id='drafted-players-dropdown', options=[{ 'label': p, 'value': p } for p in FULL_DF['player']],
app = dash.Dash() df = pd.read_csv('../dataset/wheels.csv') def encode_image(image_file): encoded = base64.b64encode(open(image_file, 'rb').read()) return 'data:image/png;base64,{}'.format(encoded.decode()) app.layout = html.Div( [ dcc.RadioItems(id='wheels', options=[{ 'label': i, 'value': i } for i in df['wheels'].unique()], value=1), html.Div(id='wheels-output'), html.Hr(), # add a horizontal rule dcc.RadioItems(id='colors', options=[{ 'label': i, 'value': i } for i in df['color'].unique()], value='blue'), html.Div(id='colors-output'), html.Img(id='display-image', src='children', height=300) ], style={ 'fontFamily': 'helvetica',
clearable=False, ), style={ 'width': '15%', 'display': 'inline-block', 'vertical-align': 'middle' }, ), ]), html.Div([ dcc.RadioItems( id='tile-values', options=[ dict(label='Democratic percentage', value='DEMOCRATIC PERCENTAGE'), dict(label='Republican percentage', value='REPUBLICAN PERCENTAGE'), ], value='DEMOCRATIC PERCENTAGE', labelStyle={'display': 'inline'}, ), ]), dcc.Graph( id='choropleth', style={'height': '80vh'}, ), html.Table( html.Tr([ html. Td('* voting districts may not be accurate for years prior to 2019', style={'text-align': 'left'}),
children=[ html.Label("History (min)", htmlFor="ctrl_time"), dcc.Input(id="ctrl_time", type="number", className="form-control", value=5, min=1, max=120, debounce=True), dcc.RadioItems(id="ctrl_category", options=[ { 'label': 'Currents ', 'value': 'Currents' }, { 'label': 'Pressures', 'value': 'Pressures' }, ], value='Currents', labelStyle={'display': 'inline-block'}), dcc.Graph(id='plot', style={"height": 700}), dcc.Interval( id='interval_update', interval=1000, # in milliseconds n_intervals=0) ]) app.layout = html.Div(className="container-fluid", children=[_HEADER, _BODY, _FOOTER])
value='CO', className="dcc_control", ), #html.P("Choose Related City:", className="control_label"), #dcc.Dropdown( # id="whichCity", #options=[{'label':opt, 'value':opt} for opt in stat_nestedOptions], #value = stat_nestedOptions[0], #options=well_type_options, #multi=True, #value=list(WELL_TYPES.keys()), # className="dcc_control", #), dcc.RadioItems(id="whichavgstate", options=whichAvgOPTS, value="sevenday", labelStyle={"display": "inline-block"}, className="dcc_control"), dcc.RadioItems( id="popratiostate", options=popOPTS, value="nonrelpop", labelStyle={"display": "inline-block"}, className="dcc_control", ), ], className="pretty_container four columns", id="cross-filter-options-state", ), html.Div( [
"font-size": 12, "display": "grid", "padding" : "1% 1% 1% 1%", "box-sizing": "border-box", #"height" : "20vh" } ) #Radio Buttons radios_div = \ html.Div([ dcc.RadioItems( id='cumulative-radio', options=[{'label': i, 'value': i} for i in ['Cumulative', 'New Cases']], value='Cumulative', labelStyle={'display': 'block'}, style={"color" : "white", "background-color":palette["block"], "font-size" : 16, "padding-top":"13%"} ), dcc.RadioItems( id='absolute-radio', options=[{'label': i, 'value': i} for i in ['Absolute', 'Per 100k Inhabitants']], value='Absolute', labelStyle={'display': 'block'}, style={"color" : "white", "background-color":palette["block"], "font-size" : 16, "margin-left" : "2%", "padding-top" : "10%"} )
# Multiple outputs import dash import dash_core_components as dcc import dash_html_components as html app = dash.Dash() app.layout = html.Div([ dcc.RadioItems(id='dropdown-a', options=[{ 'label': i, 'value': i } for i in ['Canada', 'USA', 'Mexico']], value='Canada'), html.Div(id='output-a'), dcc.RadioItems(id='dropdown-b', options=[{ 'label': i, 'value': i } for i in ['MTL', 'NYC', 'SF']], value='MTL'), html.Div(id='output-b') ]) @app.callback(dash.dependencies.Output('output-a', 'children'), [dash.dependencies.Input('dropdown-a', 'value')]) def callback_a(dropdown_value): return 'You\'ve selected "{}"'.format(dropdown_value)