ایجاد چند نمودار در یک تصویر به کمک Plotly Dash

خیلی از اوقات نیاز است برای مقایسه چند نمودار، آنها را در یک تصویر داشته باشیم. به کمک قطعه کد زیر در پایتون می توان این کار را انجام داد. لازم به ذکر است مجموعه داده از اینجا (https://vitrayco.com/pbichallenge/) تهیه شده است:

import pandas as pd
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objects as go
# Load external stylesheets
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
# dir path to download and save the stock data
datadir = './data/'
Passenger = pd.read_csv('./data/Passenger.csv')
AIR_TIME = pd.read_csv('./data/AIR_TIME.csv')
ARRIVAL_DELAY = pd.read_csv('./data/ARRIVAL_DELAY.csv')
# Define dropdown options
opts=[ {'label': 'ایران ایر', 'value': 'IR'}, {'label': 'هواپیمایی ایران ایرتور ', 'value': 'B9'},{'label': 'هواپیمایی آسمان', 'value': 'EP'},{'label': 'کیش ایر', 'value': 'Y9'},{'label': 'هواپیمایی ماهان ', 'value': 'W5'},{'label': 'هواپیمایی کارون', 'value': 'NV'},{'label': 'هواپیمایی کاسپین ', 'value': 'RV'},{'label': 'هواپیمایی قشم', 'value': 'QB'},{'label': 'هواپیمایی زاگرس ', 'value': 'ZV'},{'label': 'هواپیمایی آتا ', 'value': 'I3'},{'label': 'هواپیمایی وارش', 'value': 'VR'},{'label': 'هواپیمایی پارس ', 'value': 'PR'},{'label': 'هواپیمایی تابان', 'value': 'HH'},{'label': 'هواپیمایی سپهران ', 'value': 'IS'}
]
opts_dict={ 'IR':'ایران ایر', 'B9' : 'هواپیمایی ایران ایرتور ' , 'EP' : 'هواپیمایی آسمان',  'Y9':'کیش ایر', 'W5':'هواپیمایی ماهان ' , 'NV' : 'هواپیمایی کارون', 'RV' : 'هواپیمایی کاسپین ' , 'QB' : 'هواپیمایی قشم' , 'ZV' : 'هواپیمایی زاگرس ' , 'I3' : 'هواپیمایی آتا ', 'VR' : 'هواپیمایی وارش', 'PR' : 'هواپیمایی پارس ' , 'HH' : 'هواپیمایی تابان' , 'IS' : 'هواپیمایی سپهران '}
# Create a Dash layout
app.layout = html.Div(children=[
                                   html.H1(children='Testing dashboard v01'),
                               html.Div(children='''
Select variable to plot below.'''),
html.Div(children='''
Select variables to add to plot below.
'''),
                   dcc.Dropdown(
                  id='multiVariableDropdown',
                  options=opts,
                   value=['HH'],
                 multi=True
),
               dcc.Graph(
               id='plot2'
)
])
# Add callback functions
## For plot 2
@app.callback(Output('plot2', 'figure'),
[Input('multiVariableDropdown', 'value')])
def update_graph(selectedVariable2):

        traces = []
        for var in selectedVariable2:
               traces.append(go.Scatter(x=Passenger['MONTH'],
                                                              y=Passenger[var],
                                                              name = opts_dict[var]
                                         ))
         fig2 = go.Figure(data=traces)
         return fig2

if __name__ == '__main__':
       app.run_server(debug=True)

خروجی عبارتست از: