複数のドロップダウンメニューを設置して
それぞれの選択項目によってグラフが変わるパターンを紹介します。
コード
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 |
import dash import dash_core_components as dcc import dash_html_components as html from dash.dependencies import Input, Output import plotly.graph_objs as go import pandas as pd df = pd.read_csv('mpg.csv') app= dash.Dash() features = df.columns app.layout = html.Div([ html.Div([ dcc.Dropdown(id="xaxis",options=[{"label":i,"value":i}for i in features],value="displacement") ],style={"width":"48%","display":"inline-block"}), html.Div([ dcc.Dropdown(id="yaxis",options=[{"label":i,"value":i}for i in features],value="mpg") ],style={"width":"48%","display":"inline-block"}), dcc.Graph(id="feature-graphic") ],style={"padding":10}) @app.callback(Output("feature-graphic","figure"), [Input("xaxis","value"), Input("yaxis","value")]) def update_graph(xaxis_name,yaxis_name): return{"data":[go.Scatter(x=df[xaxis_name], y=df[yaxis_name], text=df["name"], mode="markers", marker={"size":15, "opacity":0.5, "line":{"width":0.5,"color":"white"}}) ] ,"layout":go.Layout(title="My Dashboard for MPG", xaxis={"title":xaxis_name}, yaxis={"title":yaxis_name}, hovermode="closest"), } if __name__ == '__main__': app.run_server() |
コメントを残す