FORMATTED: Original dashboard3 code from moodle
parent
c01e729bd5
commit
95e6e86cd5
|
@ -9,33 +9,106 @@ import dash_bootstrap_components as dbc
|
|||
|
||||
app = Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])
|
||||
|
||||
df = pd.DataFrame({'y': np.random.normal(loc=0, scale=10, size=1000), 'x': np.random.normal(loc=10, scale=2, size=1000)})
|
||||
df = pd.DataFrame(
|
||||
{
|
||||
"y": np.random.normal(loc=0, scale=10, size=1000),
|
||||
"x": np.random.normal(loc=10, scale=2, size=1000),
|
||||
}
|
||||
)
|
||||
|
||||
app.layout = html.Div(
|
||||
[
|
||||
html.Div([html.H1("Dashboard 3")], className="header"),
|
||||
html.Div(
|
||||
[
|
||||
dcc.Tabs(
|
||||
id="tabs",
|
||||
children=[
|
||||
dcc.Tab(
|
||||
label="Tab One",
|
||||
id="tab_1_graphs",
|
||||
children=[
|
||||
html.Div(
|
||||
[
|
||||
dbc.Row(
|
||||
[
|
||||
dbc.Col(
|
||||
[
|
||||
dcc.Dropdown(
|
||||
options=[
|
||||
"red",
|
||||
"green",
|
||||
"blue",
|
||||
],
|
||||
value="red",
|
||||
id="color",
|
||||
multi=False,
|
||||
)
|
||||
],
|
||||
width=6,
|
||||
),
|
||||
dbc.Col(
|
||||
[
|
||||
dcc.Slider(
|
||||
min=math.floor(
|
||||
df["y"].min()
|
||||
),
|
||||
max=math.ceil(
|
||||
df["y"].max()
|
||||
),
|
||||
id="min_value",
|
||||
)
|
||||
],
|
||||
width=6,
|
||||
),
|
||||
]
|
||||
),
|
||||
dbc.Row(
|
||||
[
|
||||
dbc.Col(
|
||||
[dcc.Graph(id="graph_1")], width=6
|
||||
),
|
||||
dbc.Col(
|
||||
[dcc.Graph(id="graph_2")], width=6
|
||||
),
|
||||
]
|
||||
),
|
||||
],
|
||||
className="tab_content",
|
||||
),
|
||||
],
|
||||
),
|
||||
dcc.Tab(
|
||||
label="Tab Two",
|
||||
id="tab_2_graphs",
|
||||
children=[html.Div([], className="tab_content")],
|
||||
),
|
||||
],
|
||||
)
|
||||
],
|
||||
className="content",
|
||||
),
|
||||
]
|
||||
)
|
||||
|
||||
app.layout = html.Div([html.Div([html.H1("Dashboard 3")], className="header"), html.Div([dcc.Tabs(id="tabs", children=[
|
||||
dcc.Tab(label='Tab One', id="tab_1_graphs", children=[html.Div([
|
||||
dbc.Row([dbc.Col([dcc.Dropdown(options=['red','green','blue'], value='red', id='color', multi=False)], width=6),
|
||||
dbc.Col([dcc.Slider(min=math.floor(df['y'].min()),max=math.ceil(df['y'].max()),id="min_value")], width=6)]),
|
||||
dbc.Row([dbc.Col([dcc.Graph(id="graph_1")],width=6),
|
||||
dbc.Col([dcc.Graph(id="graph_2")],width=6)])], className="tab_content"),]),
|
||||
dcc.Tab(label='Tab Two', id="tab_2_graphs",children=[html.Div([],className="tab_content")]),])], className="content")])
|
||||
|
||||
@app.callback(Output("graph_1", "figure"), Input("color", "value"))
|
||||
|
||||
def update_graph_1(dropdown_value_color):
|
||||
fig = px.histogram(df, x="y", color_discrete_sequence=[dropdown_value_color])
|
||||
fig.update_layout(template="plotly_white")
|
||||
return fig
|
||||
|
||||
@app.callback(Output("graph_2", "figure"),Input("min_value", "value"))
|
||||
|
||||
@app.callback(Output("graph_2", "figure"), Input("min_value", "value"))
|
||||
def update_graph_2(min_value):
|
||||
if min_value:
|
||||
dff = df[df['y'] > min_value]
|
||||
dff = df[df["y"] > min_value]
|
||||
else:
|
||||
dff = df
|
||||
fig = px.scatter(dff, x='x', y='y')
|
||||
fig = px.scatter(dff, x="x", y="y")
|
||||
fig.update_layout(template="plotly_white")
|
||||
return fig
|
||||
|
||||
if __name__ == '__main__':
|
||||
app.run_server(debug=True, port=8000)
|
||||
|
||||
if __name__ == "__main__":
|
||||
app.run_server(debug=True, port=8000)
|
||||
|
|
Loading…
Reference in New Issue