Dash WebApp using static externals
hi.
We are using dash webapps inside of dataiku. Which working very well!
Part of clean code priciples we are trying to separate code parts using project and global share code libraries. Which are working also "quite" well!
Only one crucial point cannot yet be resolved.
We can not separate call backs at an different code file.
Example:
FILE: backend.py
FILE: func.py
import dataiku import dash import dash_core_components as dcc import dash_html_components as html import pandas as pd import plotly.express as px import plotly.graph_objs as go from dash.dependencies import Input, Output from datetime import datetime as dt from datetime import date, timedelta # link func.py from func import show app.layout = html.Div( className="content", children=[ html.Link(rel='stylesheet', href='/local/static/dash-apps/assets/custom.css'), html.Div( className="right_content", children=[ html.Div( className="top_metrics", children=['']), html.Div(children=show()), ] ), html.Div( className="left_menu", children=layout_index ), ])
import dataiku import datetime from dash.dependencies import Input, Output, State from dash.exceptions import PreventUpdate from dash_table.Format import Format from datetime import datetime as dt import numpy as np import pandas as pd _now = datetime.datetime.now() _datestamp = _now.strftime("%Y%m%d") ds_main = dataiku.Dataset("typed_EurexCloses_unique_D") df_main = ds_main.get_dataframe() df_prep = df_main.fillna('N/A').replace('', 'N/A') def prepData(): result = df_prep return result def show(): return html.Div([ html.H3('EUREX quality setter'), html.P('CALL::' + str(_now.now())), get_table_view(), ]) def get_table_view(): return html.Div([ dash_table.DataTable( id='datatable-interactivity', #columns=[ {"name": i, "id": i, "deletable": False, "selectable": False} for i in df_main.columns ], columns=[ {"name": ["main", "id"], "id": "id"}, ... ], merge_duplicate_headers=True, data=prepData().to_dict('records'), ... ), html.Div(id='datatable-interactivity-container'), ]) @app.callback( Output('datatable-interactivity', 'style_data_conditional'), Input('datatable-interactivity', 'selected_columns') ) def update_styles(selected_columns): print ("::update_styles") return [{ 'if': { 'column_id': i }, 'background_color': '#69adff' } for i in selected_columns]
Question: How can we make '@app' accessable from different file located at project or global share code libraries?
Best Answer
-
Hi
app is actually a variable that DSS creates for you outside of your code for the webapp. You thus need to pass it to your external library as parameter to the show() method, like
from stuff import things import dash_html_components as html app.config.external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css'] app.layout = html.Div(things.make_contents(app))
which used the components setup in the stuff/things.py library file:
import dash import dash_html_components as html import dash_core_components as dcc def make_contents(app): @app.callback( dash.dependencies.Output('dd-output-container', 'children'), [dash.dependencies.Input('demo-dropdown', 'value')]) def update_output(value): return 'You have selected "{}"'.format(value) return [ dcc.Dropdown( id='demo-dropdown', options=[ {'label': 'New York City', 'value': 'NYC'}, {'label': 'Montreal', 'value': 'MTL'}, {'label': 'San Francisco', 'value': 'SF'} ], value='NYC' ), html.Div(id='dd-output-container') ]
Answers
-
that was easy, I just didn't see it to get it done by myself.
works now. thanks for.