Py.Cafe
Dash App Color Selector
- app.py
- df.csv
- requirements.txt
app.py
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
import dash
from dash import dcc, html, Input, Output
import pandas as pd
import plotly.express as px
# 1. Load Data
df = pd.read_csv('df.csv')
# Define the metrics we want to visualize
metrics = ['GMI', 'CV', 'TIR', 'TAR', 'TBR', 'GRI']
# Get list of patients
patient_options = sorted(df['Patient Name'].unique())
app = dash.Dash(__name__)
app.layout = html.Div([
html.H1("Patient CGM Metrics Trends"),
# Container for controls (Flexbox for side-by-side layout)
html.Div([
# Patient Selector
html.Div([
html.Label("Select Patient(s):"),
dcc.Dropdown(
id='patient-dropdown',
options=patient_options,
value=[patient_options[0]],
multi=True
),
], style={'width': '48%', 'display': 'inline-block'}),
# Metric Selector
html.Div([
html.Label("Select Metric:"),
dcc.Dropdown(
id='metric-dropdown',
options=metrics,
value='GMI', # Default metric
clearable=False
),
], style={'width': '48%', 'float': 'right', 'display': 'inline-block'})
], style={'padding': '20px 0'}),
dcc.Graph(id='trend-graph')
])
# 2. Callback with TWO inputs: Patient & Metric
@app.callback(
Output('trend-graph', 'figure'),
[Input('patient-dropdown', 'value'),
Input('metric-dropdown', 'value')]
)
def update_graph(selected_patients, selected_metric):
if not selected_patients:
return px.scatter(title="Select a patient to see data")
# Filter data for patients AND remove rows where the selected metric is missing
# (Different metrics might be missing for different rows)
filtered_df = df[df['Patient Name'].isin(selected_patients)]
filtered_df = filtered_df.dropna(subset=[selected_metric, 'CGM Tenure Days'])
fig = px.scatter(
filtered_df,
x="CGM Tenure Days",
y=selected_metric,
color="Patient Name",
trendline="lowess",
title=f"{selected_metric} Trends over CGM Tenure",
labels={selected_metric: selected_metric, "CGM Tenure Days": "Days on CGM"},
opacity=0.7
)
fig.update_layout(transition_duration=500)
return fig
if __name__ == "__main__":
app.run(debug=True)app.py
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
import dash
from dash import dcc, html, Input, Output
import pandas as pd
import plotly.express as px
# 1. Load Data
df = pd.read_csv('df.csv')
# Define the metrics we want to visualize
metrics = ['GMI', 'CV', 'TIR', 'TAR', 'TBR', 'GRI']
# Get list of patients
patient_options = sorted(df['Patient Name'].unique())
app = dash.Dash(__name__)
app.layout = html.Div([
html.H1("Patient CGM Metrics Trends"),
# Container for controls (Flexbox for side-by-side layout)
html.Div([
# Patient Selector
html.Div([
html.Label("Select Patient(s):"),
dcc.Dropdown(
id='patient-dropdown',
options=patient_options,
value=[patient_options[0]],
multi=True
),
], style={'width': '48%', 'display': 'inline-block'}),
# Metric Selector
html.Div([
html.Label("Select Metric:"),
dcc.Dropdown(
id='metric-dropdown',
options=metrics,
value='GMI', # Default metric
clearable=False
),
], style={'width': '48%', 'float': 'right', 'display': 'inline-block'})
], style={'padding': '20px 0'}),
dcc.Graph(id='trend-graph')
])
# 2. Callback with TWO inputs: Patient & Metric
@app.callback(
Output('trend-graph', 'figure'),
[Input('patient-dropdown', 'value'),
Input('metric-dropdown', 'value')]
)
def update_graph(selected_patients, selected_metric):
if not selected_patients:
return px.scatter(title="Select a patient to see data")
# Filter data for patients AND remove rows where the selected metric is missing
# (Different metrics might be missing for different rows)
filtered_df = df[df['Patient Name'].isin(selected_patients)]
filtered_df = filtered_df.dropna(subset=[selected_metric, 'CGM Tenure Days'])
fig = px.scatter(
filtered_df,
x="CGM Tenure Days",
y=selected_metric,
color="Patient Name",
trendline="lowess",
title=f"{selected_metric} Trends over CGM Tenure",
labels={selected_metric: selected_metric, "CGM Tenure Days": "Days on CGM"},
opacity=0.7
)
fig.update_layout(transition_duration=500)
return fig
if __name__ == "__main__":
app.run(debug=True)