def get_grid(): eq_grid = dui.Grid(_id='eq_grid', num_rows=11, num_cols=3) eq_grid.add_element(col=1, row=1, width=3, height=1, element=html.H1(id='eq_info')) eq_grid.add_graph(col=1, row=2, width=1, height=5, graph_id='ev_eq_map') eq_grid.add_graph(col=1, row=7, width=1, height=5, graph_id='ev_hist') eq_grid.add_graph(col=2, row=2, width=1, height=5, graph_id='ev_moveout') eq_grid.add_graph(col=2, row=7, width=1, height=5, graph_id='ev_resid') return eq_grid
def get_grid(): db_grid = dui.Grid(_id='db_grid', num_rows=2, num_cols=3) db_grid.add_graph(col=1, row=1, width=1, height=1, graph_id='db_eq_map') db_grid.add_graph(col=1, row=2, width=1, height=1, graph_id='db_sta_map') db_grid.add_graph(col=2, row=1, width=1, height=1, graph_id='db_failure_bar') db_grid.add_graph(col=2, row=2, width=1, height=1, graph_id='db_net_bar') db_grid.add_graph(col=3, row=1, width=1, height=1, graph_id='db_eq_scatter') db_grid.add_graph(col=3, row=2, width=1, height=1, graph_id='db_rec_scatter') return db_grid
app = Dash() app.config['suppress_callback_exceptions'] = True my_css_urls = [ "https://codepen.io/rmarren1/pen/mLqGRg.css", "https://use.fontawesome.com/releases/v5.1.0/css/all.css" ] for url in my_css_urls: app.css.append_css({ "external_url": url }) grid = dui.Grid(_id="grid", num_rows=12, num_cols=12, grid_padding=5) grid.add_graph(col=1, row=1, width=3, height=4, graph_id="all-pie") grid.add_graph(col=4, row=1, width=9, height=4, graph_id="all-bar") grid.add_graph(col=1, row=5, width=4, height=4, graph_id="produce-pie") grid.add_element( col=5, row=5, width=4, height=4, element=html.Div([ html.H1("Dash UI Grid: US Agriculture Example"), html.H3("Choose a State"), dcc.Dropdown( id="state-dropdown", options=[{'label': x.title(), 'value': x}
load_dotenv(find_dotenv()) database = os.getenv('BUILD_ENGINE') mapbox_token = os.getenv('MAPBOX_TOKEN') print(database) app = dash.Dash(__name__) colors = { 'background': '#111111', 'text': '#7FDBFF' } grid = dui.Grid(_id='grid', num_rows=4, num_cols=2, grid_padding=0) controlpanel = create_control_panel() grid.add_element(row=1, col=1, width=2, height=2, element=html.Div([ # html.H1( children='Choropleth Map', style={ 'textAlign': 'left', 'color': colors['text'] } ), html.Div(children='Example Subtitle', style={
def get_grid(): st_grid = dui.Grid(_id='st_grid', num_rows=2, num_cols=3) return st_grid
#uri = "mongodb://*****:*****@server.route("/") def MyDashApp(): return app.index() grid = dui.Grid( _id='grid', num_rows=12, num_cols=12, grid_padding=0, ) grid.add_element( # top bar col=1, row=1, width=12, height=1, element=html.Div( id='top-div', style=dict(backgroundColor="skyBlue", height="95%", width="100%", textAlign='center'), children=[
import dash import dash_core_components as dcc import dash_html_components as html import dash_ui as dui from datetime import datetime as dt from Jumpscale import j external_stylesheets = [ "https://codepen.io/rmarren1/pen/mLqGRg.css", "https://codepen.io/chriddyp/pen/bWLwgP.css", "https://use.fontawesome.com/releases/v5.1.0/css/all.css", ] app = dash.Dash(__name__, external_stylesheets=external_stylesheets) grid_top = dui.Grid("grid_top", num_rows=1, num_cols=2, grid_padding=2) grid = dui.Grid("grid", num_rows=12, num_cols=2, grid_padding=2) controlpanel = dui.ControlPanel("controlpanel") controlpanel.create_group(group="State", group_title="Select Simulation.") state_select = dcc.Dropdown(id="state-dropdown", options=[{ "label": "test", "value": "A" }], value="A") controlpanel.add_element(state_select, "State") markdown_text = """ # Exit Bonus Simulation
def update_page(n_clicks, ticker): grid = dui.Grid(_id="grid", num_rows=12, num_cols=12, grid_padding=0) name_output = html.Div([html.H1('LIGHTHAVEN FUND SCREENER')], style={'textAlign': 'center', 'fontSize':20}) grid.add_element(col=1, row=1, width=12, height=1, element=name_output) # Background Color grid.add_element(col=1, row=2, width=12, height=11, element=html.Div( style={"background-color": "gainsboro", "height": "100%", "width": "100%"} )) grid.add_element(col=1, row=8, width=6, height=2, element=html.Div( style={"background-color": "black", "height": "100%", "width": "100%"} )) grid.add_element(col=1, row=1, width=12, height=1, element=html.Div( style={"background-color": "lightskyblue", "height": "100%", "width": "100%"} )) # Stock Chart start = datetime.datetime.today() - relativedelta(years=5) end = datetime.datetime.today() try: price_data = yf.download(ticker, start, end) except: return "Could not get data" trace_close = go.Scatter(x=list(price_data.index), y=list(price_data.Close), name="close", line=dict(color="#03b1fc")) data = [trace_close] layout = go.Layout( dict(title=ticker + " - HISTORIC STOCK PRICE", showlegend=False), margin = {'l': 50, 'r': 50, 't': 50, 'b': 50} ) fig = dict(data=data, layout=layout) stock_chart = dcc.Graph(id="Stock Graph", figure=fig) grid.add_element(col=1, row=2, width=6, height=4, element=(stock_chart)) # Company Description def find_description(list): test = [] for item in list: if (len(item) > 100): test.append(item) return test try: page = requests.get('https://finance.yahoo.com/quote/' + ticker + '/profile?p=' + ticker) from lxml import html as html2 tree = html2.fromstring(page.content) data = tree.xpath('//p/text()') description = find_description(data)[0] description = str(description) description_output = html.Div([html.H1('COMPANY DESCRIPTION'), html.P(description)]) except: description_output = html.Div([html.P("Could not find description")]) grid.add_element(col=8, row=2, width=5, height=6, element=description_output) all_info = execute(ticker) if (type(all_info) == str): not_found = description_output = html.Div([html.H1("Please verify the ticker was entered correctly. Since the information could not be scraped, please manually screen the company.")]) grid.add_element(col=1, row=7, width=3, height=3, element=not_found) return dui.Layout( grid=grid) fast_df = all_info[0] fast = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in fast_df.columns], data=fast_df.to_dict('records'), style_cell = {'textAlign' : 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "True"' }, 'backgroundColor': '#ACFC6A', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "False"' }, 'backgroundColor': '#FF8787', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "Subjective"' }, 'backgroundColor': '#fdff82', 'color': 'black', }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ], ) grid.add_element(col=1, row=6, width=3, height=3, element=fast) stalwart_df = all_info[1] stalwart = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in stalwart_df.columns], data=stalwart_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "True"' }, 'backgroundColor': '#ACFC6A', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "False"' }, 'backgroundColor': '#FF8787', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "Subjective"' }, 'backgroundColor': '#fdff82', 'color': 'black', }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ], ) grid.add_element(col=1, row=9, width=3, height=2, element=stalwart) surfer_df = all_info[2] surfer = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in surfer_df.columns], data=surfer_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "True"' }, 'backgroundColor': '#ACFC6A', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "False"' }, 'backgroundColor': '#FF8787', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "Subjective"' }, 'backgroundColor': '#fdff82', 'color': 'black', }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ], ) grid.add_element(col=1, row=11, width=3, height=2, element=surfer) dead_df = all_info[3] dead = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in dead_df.columns], data=dead_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "True"' }, 'backgroundColor': '#ACFC6A', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "False"' }, 'backgroundColor': '#FF8787', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "Subjective"' }, 'backgroundColor': '#fdff82', 'color': 'black', }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ], ) grid.add_element(col=4, row=6, width=3, height=3, element=dead) fad_df = all_info[4] fad = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in fad_df.columns], data=fad_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "True"' }, 'backgroundColor': '#ACFC6A', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "False"' }, 'backgroundColor': '#FF8787', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "Subjective"' }, 'backgroundColor': '#fdff82', 'color': 'black', }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ], ) grid.add_element(col=4, row=9, width=3, height=2, element=fad) hot_df = all_info[5] hot = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in hot_df.columns], data=hot_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "True"' }, 'backgroundColor': '#ACFC6A', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "False"' }, 'backgroundColor': '#FF8787', 'color': 'black', }, { 'if': { 'column_id': 'STATUS', 'filter_query': '{STATUS} eq "Subjective"' }, 'backgroundColor': '#fdff82', 'color': 'black', }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ], ) grid.add_element(col=4, row=11, width=3, height=2, element=hot) fundamentals_df = all_info[6] fundamentals = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in fundamentals_df.columns], data=fundamentals_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ] ) grid.add_element(col=8, row=6, width=2, height=2, element=fundamentals) annual_financials_df = all_info[7] annual = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in annual_financials_df.columns], data=annual_financials_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ] ) grid.add_element(col=8, row=8, width=5, height=3, element=annual) quarterly_financials_df = all_info[8] quarterly = dash_table.DataTable( id='table', columns=[{"name": i, "id": i} for i in quarterly_financials_df.columns], data=quarterly_financials_df.to_dict('records'), style_cell={'textAlign': 'left'}, style_header={ 'backgroundColor': 'white', 'fontWeight': 'bold' }, style_data_conditional=[ { 'if': {'row_index': 'odd'}, 'backgroundColor': 'rgb(248, 248, 248)' }, { 'if': { 'column_id': 'STATUS'}, 'width': '25%' } ] ) grid.add_element(col=8, row=11, width=5, height=2, element=quarterly) return dui.Layout( grid=grid)
def init_dasboard(server): dash_app = dash.Dash(server=server, routes_pathname_prefix='/dashapp/', external_stylesheets=[dbc.themes.FLATLY]) df = pd.DataFrame({ 'month': ['Enero', 'Febrero', 'Marzo', 'Todos'], 'day': [[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31 ], [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28 ], [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31 ], []], 'users': [[ 325, 324, 405, 400, 424, 404, 417, 432, 419, 394, 410, 426, 413, 419, 404, 408, 401, 377, 368, 361, 234, 356, 345, 354, 345, 345, 378, 344, 342, 412, 453 ], [ 432, 419, 394, 410, 426, 413, 419, 404, 408, 401, 377, 368, 361, 234, 356, 345, 354, 345, 345, 378, 344, 342, 412, 453, 324, 405, 400, 424 ], [ 408, 401, 377, 368, 361, 234, 356, 345, 354, 345, 345, 378, 344, 342, 412, 453, 324, 405, 400, 424, 432, 419, 394, 410, 426, 413, 419, 404, 408, 401, 377 ], []] }) # --------- GRID --------- # grid = dui.Grid(_id="grid-1", num_rows=12, num_cols=12, grid_padding=0) # BOTÓN FILTROS grid.add_element(col=1, row=1, width=12, height=1, element=dbc.Button('FILTROS', id='filtros-1', style={ 'width': '100%', 'heigth': '100%' }, className='bg-primary text-white')) # MODAL grid.add_element( col=1, row=1, width=12, height=12, element=dbc.Modal( id='modal-filtros-1', children=[ dbc.ModalHeader('Filtros'), dbc.ModalBody([ dbc.Label('Agrupar por'), dbc.RadioItems(id='option-group', className='d-flex justify-content-around', value='mensual', options=[{ 'label': 'Mensual', 'value': 'mensual' }, { 'label': 'Diario', 'value': 'diario' }]), dbc.Label('Seleccionar mes'), dbc.Select( id='option-month', className= 'class="col-sm-10 align-self-center custom-select"', value=0, options=[{ 'label': df.month[i], 'value': i } for i in range(len(df.month))]) ]), dbc.ModalFooter( dbc.Button('CERRAR', id='close-filtros-1', style={'width': '100%'}, className='bg-primary text-white')) ], is_open=False, style={'height': '80%'}, className='p-3', size='lg', scrollable=True)) # GRÁFICO 1 grid.add_graph(col=1, row=2, width=12, height=3, graph_id='graph-1') # GRÁFICO 2 grid.add_graph(col=1, row=5, width=6, height=4, graph_id='graph-2') # GRÁFICO 3 grid.add_graph(col=8, row=5, width=5, height=4, graph_id='graph-3') # --------------------------- # dash_app.layout = html.Div(children=[ html.Meta( name='viewport', content='width=device-width, initial-scale=1, shrink-to-fit=no, \ maximum-scale=1, minimum-scale=1, user-scalable=0'), dui.Layout(grid=grid), dcc.Interval(id='interval-users', interval=1 * 5000, n_intervals=0) ], style={ 'height': '100vh', 'width': '100vw' }) # --------- EVENTOS --------- # @dash_app.callback(Output('graph-1', 'figure'), Output('graph-2', 'figure'), Output('graph-3', 'figure'), Input('option-month', 'value'), Input('option-group', 'value'), Input('interval-users', 'n_intervals')) def change_month(pos, group, n): update_users = randrange(20) month_pos = randrange(len(df.month[:-1])) day_pos = randrange(len(df.users[month_pos])) df.users[month_pos][day_pos] += update_users pos = int(pos) fig1 = go.Figure() fig2 = go.Figure() if pos == len(df.month[:-1]): total = 0 for i in range(len(df.month[:-1])): total += int(sum(df.users[i])) fig1.add_trace( go.Indicator(mode='number', value=total, title={'text': 'Usuarios totales'}, domain={ 'y': [0, 1], 'x': [0, 1] })) for i in range(len(df.month[:-1])): fig2.add_trace( go.Scatter(x=df.day[i], y=df.users[i], name=df.month[i][:3])) else: if group == 'mensual': if pos == 0: fig1.add_trace( go.Indicator(mode="number+delta", value=sum(df['users'][pos]), delta={ 'reference': 0, 'valueformat': '.0f' }, title={ "text": "Usuarios mensuales en {}".format( df.month[pos]) }, align='center', domain={ 'y': [0, 1], 'x': [0, 1] })) else: fig1.add_trace( go.Indicator(mode="number+delta", value=sum(df.users[pos]), delta={ 'reference': sum(df.users[pos - 1]), 'valueformat': '.0f' }, title={ "text": "Usuarios mensuales en {}".format( df.month[pos]) }, align='center', domain={ 'y': [0, 1], 'x': [0, 1] })) else: fig1.add_trace( go.Indicator(mode='number+delta', value=df.users[pos][len(df.users[pos][:-1])], delta={ 'reference': df.users[pos][len(df.users[pos][:-2])], 'valueformat': '.0f' }, title={ 'text': 'Usuarios el último día de {}'.format( df.month[pos]) }, align='center', domain={ 'y': [0, 1], 'x': [0, 1] })) fig2.add_trace(go.Scatter(y=df.users[pos], x=df.day[pos]), ) fig2.update_layout(plot_bgcolor='white', margin={ 'l': 0, 'r': 30, 'b': 50, 't': 0, 'pad': 0 }, legend={ 'orientation': 'h', 'yanchor': 'bottom', 'y': 1, 'xanchor': 'left', 'x': 0 }, modebar={'orientation': 'v'}) values_pie = [] labels_pie = [] for m in range(len(df.month[:-1])): values_pie.append(sum(df.users[m])) labels_pie.append(df.month[m][:3]) fig3 = go.Figure(go.Pie(labels=labels_pie, values=values_pie)) fig3.update_layout(margin={ 'l': 0, 'r': 0, 'b': 0, 't': 0, 'pad': 0 }, legend={ 'orientation': 'h', 'yanchor': 'bottom', 'y': 1.02, 'xanchor': 'left', 'x': 0 }, modebar={'orientation': 'v'}) return fig1, fig2, fig3 @dash_app.callback( Output("modal-filtros-1", "is_open"), Input("filtros-1", "n_clicks"), Input("close-filtros-1", "n_clicks"), State("modal-filtros-1", "is_open"), ) def open_filtros_1(open, close, is_open): if open or close: return not is_open return is_open
'font-size': '13px', 'color': 'lightsalmon' }, style_data_conditional=[ { 'if': { 'row_index': 'odd' }, 'backgroundColor': 'rgb(248, 248, 248)' }, ]) ]) #grid grid = dui.Grid(num_rows=9, num_cols=3, grid_padding=0) grid.add_element(col=1, row=1, width=3, height=1, element=header()) grid.add_element(col=1, row=2, width=1, height=4, element=data_picker()) grid.add_element(col=2, row=2, width=1, height=2, element=station_dropdown()) grid.add_element(col=3, row=2, width=1, height=2, element=component_multidropdown()) grid.add_element(col=1, row=3, width=1, height=4, element=summary_table()) grid.add_element(col=1, row=4, width=2, height=5, element=serbia_map()) grid.add_element(col=1, row=5, width=2, height=5, element=line_chart()) #main part app.layout = html.Div(grid.get_component(), )
def get_grid(): rec_grid = dui.Grid(_id='rec_grid', num_rows=1, num_cols=1) rec_grid.add_graph(col=1, row=1, width=1, height=1, graph_id='rec_plot') return rec_grid