I tried to mimic this example: Callbacks: return a go.Figure?
so started trying to use bootstrap components.
All my status codes are 200 for the initial page load although it does not do so as intended. Also it does not look like it is reacting to any of the changes in input from dcc.Dropdown.
My current code:
# -*- coding: utf-8 -*-
"""
@author;
"""
from dash import Dash
from dash.dependencies import Input, Output
from Dashboard.utils.Dash_fun import apply_layout_with_auth
import dash_core_components as dcc
import dash_bootstrap_components as dbc
import dash_html_components as html
from Dashboard.utils.Dash_App_utils import (table_names_arr,csv_names_arr, make_dataframes,
make_table, make_figure)
url_base = '/dash/app3/'
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
colors={
'background': 'white',
'text': 'black'
}
# make all dataframes from csv
df_arr = make_dataframes()
layout = dbc.Container(
[
html.H1("Nutrients Dashapp1",
style={
'textAlign': 'center',
'color': colors['text']
}),
html.Hr(),
dbc.Row([
dbc.Col(
html.Div([
dcc.Dropdown(
id='pick-table-dropdown',
options=[{'label': i, 'value': i} for i in table_names_arr],
value=table_names_arr[0]
),
html.Div(
id="you-picked"
)],
),
width=12
)
]),
dbc.Row([
dbc.Col([
html.Div(
id='which-table'
)],
width=12
)
]),
dbc.Row([
dbc.Col(
dcc.Graph(id='rdi-figure'),
width=12
)
], align='center',
)
],
fluid=True,
)
def Add_Dash(server):
app=Dash(server=server, url_base_pathname=url_base,
external_stylesheets=[dbc.themes.BOOTSTRAP])
apply_layout_with_auth(app, layout)
@app.callback(
[Output('which-table', 'children'), #Output('numeric-table', 'children'),
Output('you-picked', 'children'),
Output('graph1', 'figure')],
[Input('pick-table-dropdown', 'value')])
def render_content(value):
the_df = None
table = None
for i in range(len(table_names_arr)):
if table_names_arr[i]==value:
the_df = df_arr[i]
table = make_table(the_df)
break
# assert table
figure = make_figure(the_df, value)
#val_string = f'you selected {value}'
return table, f'your input is {value}', figure
return app.server
What was working before without bootstrap (well not really, my figures were loading in a fresh tab not the page where I wanted them so I used fig.show())
# -*- coding: utf-8 -*-
"""
@author;
"""
from dash import Dash
from dash.dependencies import Input, Output
from Dashboard.utils.Dash_fun import apply_layout_with_auth
import dash_core_components as dcc
import dash_html_components as html
from Dashboard.utils.Dash_App_utils import (table_names_arr,csv_names_arr, make_dataframes,
make_table, make_figure)
url_base = '/dash/app3/'
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
colors={
'background': 'white',
'text': 'black'
}
# make all dataframes from csv
df_arr = make_dataframes()
layout = html.Div([
dcc.Location(id='url', refresh=False),
html.H1(children="Nutrients Dashapp1",
style={
'textAlign': 'center',
'color': colors['text']
}),
html.Br(),
html.Br(),
dcc.Dropdown(
id='pick-table-dropdown',
options=[{'label': i, 'value': i} for i in table_names_arr],
value=table_names_arr[0]
),
#html.Div(id='selected-item'),
html.Div(id='which-table'),
html.Div(id='numeric-table'),
html.Br(),
html.Div(id='rdi-figure'),
#html.Div(id='model-table'),
#generate_table(demo_df)
])
def Add_Dash(server):
app=Dash(server=server, url_base_pathname=url_base)
apply_layout_with_auth(app, layout)
@app.callback(
[Output('which-table', 'children'), #Output('numeric-table', 'children'),
Output('rdi-figure', 'children')],
[Input('pick-table-dropdown', 'value')])
def render_content(value):
the_df = None
table = None
for i in range(len(table_names_arr)):
if table_names_arr[i]==value:
the_df = df_arr[i]
table = make_table(the_df)
break
# assert table
figure = make_figure(the_df, value)
#val_string = f'you selected {value}'
return table, figure
return app.server