A python dash web multiplot example reading CSV data

I previously used plotty to get a python plot on a website. It’s time to elaborate. Now we want to have two plots with data from a CSV file. It’s not as complicated as it sounds. Allow me to show and explain.

import dash
from dash import dcc, html
from dash.dependencies import Input, Output
import plotly.express as px
from plotly.subplots import make_subplots
import plotly.graph_objects as go
import pandas as pd

app = dash.Dash(__name__)

df = pd.read_csv('data3colums.csv')
##columns are named here and you need to use these names
df.columns=['Time','data','Size(T)']
fig = px.line(df, x="Time",y="data",markers=True)
fig2 = px.line(df, x="Time",y="Size(T)",markers=True)
app.layout = html.Div(children=[
     # All elements from the top of the page
     html.Div([
     html.H1(children='Time series one'),
     html.Div(children='''Title one'''),
         dcc.Graph(id='graph1',figure=fig), 
     ]),
     # New Div for the new 'row' of the page
     html.Div([
     html.H1(children='Time Series two'),
     html.Div(children='''Title two'''),
         dcc.Graph(id='graph2',figure=fig2), 
     ]),
])
if __name__ == '__main__':
app.run_server(debug=True,host='IP-OF-MY-MACHINE')

If you want to know more about how to plot data from CSV here you have the plotly documetation. It can be useful also to know about plotting time series, since at least in my CSV I have time tags. And here you have the stackoverflow post about this topic. Because we can’t forget about stackoverflow.

EDIT: this post has been backdated to “yesterday” because I forgot to publish it, so another post may come later. Hopefully…this will mean I had time for my things 😉