def create(self, **args): id = args['id'] return html.Div([ html.Img(src=self.circle_img, height=f'{self.height}', style=self.rocket_style), html.Img(src=self.rocket_img, height=f'{self.height}', style=self.circle_style, id=id), html.Div('', style={'height': f'{self.height}px'}), ], className='card-body')
def create(self, **args): title = args['title'] col_sizes = ' '.join( [f'col-{key}-{val}' for key, val in args['col_sizes'].items()]) header_children = [html.H3(title, className='card-title')] if 'card_options' in args: header_children.append( html.Div(args['card_options'], className='card-options')) header = html.Div(header_children, className='card-header') children = [header] + args['children'] if 'footer_id' in args: children.append( html.Div('', id=args['footer_id'], className='card-footer')) return html.Div([ html.Div(children, className='card'), ], className=col_sizes)
layout = html.Div([ html.Div([ dcc.Input(id='endpoint_id', placeholder='Endpoint...', type='text', value=''), dcc.Input(id='group_token_id', placeholder='Group-Token...', type='text', value=''), dcc.Input(id='session_token_id', placeholder='Session-Token...', type='text', value=''), ]), dt.DataTable( id='datatable-row-ids', style_data={'whiteSpace': 'normal'}, css=[{ 'selector': '.dash-cell div.dash-cell-value', 'rule': 'display: inline; white-space: inherit; overflow: inherit; text-overflow: inherit;' }], columns=[ { 'name': i, 'id': i, 'deletable': False } for i in df.columns # omit the id column if i != 'id' ], data=df.to_dict('records'), editable=True, filter_action="native", sort_action="native", sort_mode='multi', row_selectable='multi', row_deletable=True, selected_rows=[], page_action='native', page_current=0, page_size=10, ), # html.Div(id='datatable-row-ids-container') ])
from app import app, dcc, html, Input, Output from pages import surveillance app.layout = html.Div( [dcc.Location(id='url', refresh=False), html.Div(id='page-content')]) @app.callback(Output('page-content', 'children'), [Input('url', 'pathname')]) def display_page(pathname): if pathname == '/': return surveillance.layout elif pathname == '/surveillance': return surveillance.layout else: return '404' if __name__ == '__main__': app.run_server(debug=True)
row = Row() simulation = row.create(children=[ card.create( title='Simulation', children=[ dcc.Dropdown( id='sim-dropdown', options=[ {'label': 'random sensor data', 'value': 'random_sensor_data'}, {'label': 'gps data', 'value': 'gps'}, {'label': 'orientation data', 'value': 'orientation'}, ], value='random_sensor_data' ), html.Div(id='simulation-output'), html.Div(id='cancel-output') ], card_options=[ html.Button('Start', id='start-button', className='btn btn-primary btn-sm', style={'margin-right': '5px'}), html.Div(), html.Button('Stop', id='cancel-button', className='btn btn-danger btn-sm') ], col_sizes={'md': 6, 'xl': 4} ) ]), @app.callback(
global sensors global values sensors = ["S1", "S2", "S3", "S4", "S5"] values = [1, 2, 3, 4, 5] overview = html.Div([ html.H2('Hello World'), dcc.Dropdown(id='dropdown', options=[{ 'label': i, 'value': i } for i in ['LA', 'NYC', 'MTL']], value='LA'), html.Div(id='display-value'), html.Table( # Sensor names [html.Tr([html.Th("Sensor", ), html.Th("Value")])] + # Sensor Values [ html.Tr([html.Td(sensors[i]), html.Td(values[i])]) for i in range(max(len(sensors), len(values))) ]) ]) @app.callback(dash.dependencies.Output('display-value', 'children'), [dash.dependencies.Input('dropdown', 'value')]) def display_value(value):
from app import app, html, dcc, dash from db import Data, Sensor import dash_table import pandas as pd sensors = html.Div([ html.H2('Sensors'), html.Div(id='display-sensor'), dcc.Interval( id='interval-component', interval=1 * 1000, # in milliseconds n_intervals=0), html.H2('Sensor Values'), html.Div(id='display-value') ]) def getSensorTable(): sensor_query = Sensor.query df = pd.read_sql(sensor_query.statement, sensor_query.session.bind) return dash_table.DataTable( id='sensor-table', data=df.to_dict('records'), columns=[{ "name": i, "id": i } for i in df.columns], style_cell={ 'textAlign': 'center', 'min-width': '50px'
def update_layout(): # load parameter from webapp param_hist = MyPickle.load('work_queue.pkl') # get all paid, df, ultimate, ibnr from data output = _get_paid_df_ult_ibnr_M2Qper(param_hist) # calculate quarterly proportion over portfolio percent_ibnr_over_portfolio = cal_QUARTERLY_percent_over_portfolio( output, 'IBNR') percent_paid_over_portfolio = cal_QUARTERLY_percent_over_portfolio( output, 'PAID') # impute ibnr with paid when null percent_paid_over_portfolio.columns = percent_ibnr_over_portfolio.columns per_Over_port = percent_ibnr_over_portfolio.combine_first( percent_paid_over_portfolio) # ============================================================================= # CALCULATE ALLOCATION PERCENTAGE # Methods: # 1. Find column with name "month to quarter percentage" from "output". # 2. Multiply the above with proportion of the portfolio when it is a subset of the portfolio (risk cluster), # otherwise use the month to quarter percentage. # ============================================================================= level0 = output.columns.get_level_values(0) level1 = output.columns.get_level_values(1) level2 = output.columns.get_level_values(2) a = level2.str.contains('percent_M/Q') for i, x in enumerate(a): if x == True: # This is #1 key = level0[i] + level1[i] if level1[ i] != 'ALL': # this is #2 (only active when it is a risk cluster) col = per_Over_port.columns.get_level_values(1).get_loc( level1[i]) # column id of the risk cluster percent_M_over_Q = output.iloc[:, i] per_Over_port_i = per_Over_port.iloc[:, col] percent_allocation = percent_M_over_Q * per_Over_port_i output[level0[i], level1[i], 'percent_over_portfolio:%s' % key] = per_Over_port_i output[level0[i], level1[i], '5.ALLOCATION:%s' % key] = percent_allocation else: output[level0[i], level1[i], '5.ALLOCATION:%s' % key] = output[(level0[i], level1[i], 'percent_M/Q:%s' % key)] output = output.sort_index(axis=1) ## Formating in APP # drop unnecessary colomun that not render drop_col = output.filter(regex=r'(percent| *_q)').columns output.drop(drop_col, axis=1, inplace=True) # convert index to string for rendering output.reset_index( level='Q', drop=True, inplace=True) # drop the quarterly index which no longer use output = output.reset_index(level='M').rename(columns={ '': 'Accident Period', 'M': 'Accident Period' }) output['Accident Period'] = output['Accident Period'].astype(str) # ============================================================================= # compile dictionary for APP # ============================================================================= level0 = output.columns.get_level_values(0) level1 = output.columns.get_level_values(1) level2 = output.columns.get_level_values(2) output.columns = output.columns.droplevel([0, 1]) columns = [] for i in zip(level0, level1, level2): if i[0] == 'Accident Period': # cater format for index col = {'name': [i[0], i[1], i[2]], 'id': i[2], 'type': 'text'} else: col = { 'name': [i[0], i[1], i[2].split(":")[0].split(".")[1]], 'id': i[2], 'type': 'numeric' } if 'DF' in i[2]: col['format'] = Format(precision=3, scheme=Scheme.fixed) elif 'ALLOCATION' in i[2]: col['format'] = Format(precision=3, scheme=Scheme.percentage) elif 'percent' in i[2]: col['format'] = Format(precision=3, scheme=Scheme.percentage) else: col['format'] = Format(group=',', precision=0, scheme=Scheme.fixed) columns.append(col) output.fillna(0, inplace=True) output = output.to_dict('records') # ============================================================================= # place information into html # ============================================================================= table_ultimate = html.Div([ dash_table.DataTable( id='ultimate', columns=columns, data=output, editable=True, sort_action="native", export_format="csv", merge_duplicate_headers=True, #style_data_conditional = None, style_header={ 'fontWeight': 'bold', 'textAlign': 'center' }, style_table={ 'minWidth': '100%', 'overflowX': 'auto' }, fixed_columns={ 'headers': True, 'data': 1 }) ]) content = html.Div([table_ultimate], style=CONTENT_STYLE) layout = html.Div([ nav, content, ]) return layout
row = Row() overview = html.Div([ html.H2('Overview'), dcc.Interval( id='interval-component', interval=1*1000, # in milliseconds n_intervals=0 ), row.create(children=[ card.create( title='Orientation', children=[orientation.create(id='orientation')], footer_id='orientation_text', col_sizes={'md': 6, 'xl': 4} ), card.create( title='Altitude', children=[ dcc.Graph( id='altitude-graph', figure=go.Figure(data=[go.Scatter(x=[0], y=[0])]) ) ], footer_id='altitude_text', col_sizes={'md': 12, 'xl': 8} ), ]) ])
"height": 30, "padding": "2rem 1rem", "background-color": "#f8f9fa", } # HTML component select_product_code_claim = html.Div([ html.P('Product Claim Code:', className='thick underline'), dcc.Dropdown( id='product_code_claim', options=[{'label':'111', 'value':'111'}, {'label':'116', 'value':'116'}, {'label':'119', 'value':'119'}, {'label':'126', 'value':'126'}, {'label':'430', 'value':'430'}, {'label':'431', 'value':'431'}, {'label':'432', 'value':'432'}, {'label':'441', 'value':'441'}, {'label':'442', 'value':'442'}, ], value=['119'], multi=True, persistence=True, persistence_type='memory' ) ]) select_risk_cluster = html.Div([ html.P('Risk Cluster:', className='thick underline'), dcc.Dropdown( id='risk_group', #value=None, multi=True,
def create(self, **args): return html.Div(args['children'], className="row")
from app import html, inner_html, load_html, dji map = html.Div([ inner_html(load_html('worldwind')), dji.Import(src="./assets/js/dashlocal-map.js"), ])