Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

Plotting multiple time series on one plot

I have been trying to plot multiple time series on one plot. where the plot will refresh whenever a new symbol is added or removed through the dropdown menu. Then the plotting will be done using curflings. The challenge is am failing to display the graphs even for a single counter. Is there a simpler way besides the code below to do it, given that a dataframe needs to be created iteratively using a url thats standard for the datasource.

import pandas as pd
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
import cufflinks as cf
cf.go_offline()


app = dash.Dash()

app.layout = html.Div([
    html.H1('Stock Tickers'),
    dcc.Dropdown(
        id='my-dropdown',
        options=[
            {'label': 'Coke', 'value': 'COKE'},
            {'label': 'Tesla', 'value': 'TSLA'},
            {'label': 'Apple', 'value': 'AAPL'}
        ],
        value=['COKE'],
        multi = True,
    ),
    dcc.Graph(id='my-graph')
])
@app.callback(Output('my-graph', 'figure'), [Input('my-dropdown', 'value')])
def plot_time_series(dropdown_value):
    df = pd.DataFrame()
    for x in dropdown_value:
        dat_x=pd.read_csv("http://www.google.com/finance/historical?q="+x+"&startdate=Jul%2008%2C%202017&enddate=Aug%2008%2C%202017&output=csv")
        dat_x.set_index("Date", inplace= True)
        df=pd.concat([df,dat_x.Close],axis=1)
    df.columns=dropdown_value
    return { 'data': [ df.iplot(asFigure=True)  ] }

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

My guess is that df.iplot(asFigure=True) returns an entire “figure” object which includes the data key already. So, you may be able to just return df.iplot(asFigure=True).

“figure” refers to a dict-like structure that has two keys: data and layout. data is an array which itself contains a series of dict-like structures, each one representing a series in the graph. layout is a dict-like structure that describes the rest of the plot besides the series: the titles, the axes, the annotations, etc.

1 Like

it worked, thanks. so when returning a plot, just return the df.iplot will do the job.