I am working an IOT project where Data points are only stored if the value changes. I am recreating a more extensive dashboard that was originally done in grafana. I need to display the data as shown in the picture:
, where when the machine is not running the timestamps show a zero or null value. Currently I have this for a quick trial:This is just a trial chart to get the formatting figured out.
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
import plotly.graph_objects as go
import plotly.express as px
import datetime
app = dash.Dash(__name__)
df = pd.read_csv('<mycsvfile>')
app.layout =html.Div([
html.Div([
dcc.Dropdown(
id="DataSelect",
options = [{"label":x, "value":x}
for x in df.columns[1:]],
multi=False,
placeholder='Machine_Speed',
value=df.columns[1],
clearable=False,
)
]),
html.Div([
dcc.Graph(id="time-series-chart")
],
style={'width': '95%', 'display': 'inline-block'})
])
@app.callback(
Output("time-series-chart","figure"),
Input("DataSelect", "value")
)
def update_output(DataSelect):
fig = go.Figure()
# Add Traces
fig.add_trace(go.Line(
x=df['date'], y=df[DataSelect]
))
return fig
app.run_server(debug = True)