Hello @AnnMarieW
Here is an example of my problem.
- I have this code in app.py :
from dash import Dash, html, dcc, Input, Output, State
import dash_bootstrap_components as dbc
from dash_iconify import DashIconify
app = Dash(__name__, use_pages=True, external_stylesheets=[dbc.themes.SUPERHERO])
sidebar = dbc.Nav([
dbc.NavLink([
html.Div(page["name"], className="ms-2", style={}),
], href=page["path"], style={},
active="exact",
)
for page in dash.page_registry.values()
], vertical=True,
pills=True,
className="bg-dark",
)
download_icon = DashIconify(icon='ic:baseline-menu', width=40, style={})
app.layout = dbc.Container([
dbc.Row([
dbc.Col([
dbc.Button([download_icon, ''], id="open-offcanvas", n_clicks=0),
], width=1,
style={'margin-left': 0,
'padding': 10}
),
dbc.Col(
html.Div("Dashboard",
style={'fontSize': 40,
'textAlign': 'center',
}
)
)
]),
html.Hr(
style={'margin-top': 0, 'opacity': 1}
),
dbc.Row([
dbc.Offcanvas(
dbc.Col([sidebar], width=12),
id="offcanvas", title="Menu", is_open=False,
style={'width': 300, 'top': 60,
'background-color': '#242A33',
},
),
],),
dbc.Row([
dbc.Col([dash.page_container])
])
], fluid=True,
)
@app.callback(
Output("offcanvas", "is_open"),
Input("open-offcanvas", "n_clicks"),
[State("offcanvas", "is_open")],
)
def toggle_offcanvas(n1, is_open):
if n1:
return not is_open
return is_open
if __name__ == "__main__":
app.run(debug=True)
- in pages folder and in heatmap1.py:
from dash import Dash, html, dcc, Output, Input, State, MATCH, ALL, callback
import plotly.express as px
import pandas as pd
import numpy as np
import dash_bootstrap_components as dbc
dash.register_page(__name__, path='/', name='Heat Map1')
layout = dbc.Row([
dbc.Col([
dcc.Dropdown(id='test1',
options=['var1', 'var2'],
clearable=True,
value=['var1']
)
], width=1,
),
dbc.Row([
dbc.Col([
dcc.Graph(id='graph1',
figure={}
)
]),
])
])
@callback(
Output('graph1', 'figure'),
Input('test1', 'value'),
prevent_initial_call=True
)
def update_graph2(z):
x, y = np.arange(101), np.arange(101)
path = 'C:/Users/.../'
df = pd.read_csv(path + z + '.csv')
fig1 = px.imshow(df,
labels=dict(x="X", y="Y", color="Z"),
x=x, y=y
)
return fig1
- in pages folder and in heatmap2.py:
from dash import Dash, html, dcc, Output, Input, State, MATCH, ALL, callback
import plotly.express as px
import pandas as pd
import numpy as np
import dash_bootstrap_components as dbc
dash.register_page(__name__, name='Heat Map2')
layout = dbc.Row([
dbc.Col([
dcc.Dropdown(id='test2',
options=['var1', 'var2'],
clearable=True,
value=['var1']
)
], width=1,
),
dbc.Row([
dbc.Col([
dcc.Graph(id='graph2',
figure={}
)
]),
])
])
@callback(
Output('graph2', 'figure'),
Input('test2', 'value'),
prevent_initial_call=True
)
def update_graph2(z):
x, y = np.arange(101), np.arange(101)
path = 'C:/Users/.../'
df = pd.read_csv(path + z + '.csv')
fig1 = px.imshow(df,
labels=dict(x="X", y="Y", color="Z"),
x=x, y=y
)
return fig1
To run the codes it needs a csv file with 101*101 shape.
