I’m pulling a json array from a server and I’m trying to feed it into a live graph.
The array takes the format of: [{“t”:“2020-01-05T22:27:53.000Z”,“v”:0.022,“ch”:1},{“t”:“2020-01-05T22:28:36.000Z”,“v”:0.022,“ch”:2}, etc]
I’m having two problems though, first the user can use a set of rangeselector buttons to switch from looking at a day from the last post, a month, or a year, but when the callback updates the graph it resets to showing all the data and not what the user chose.
The second problem is that line_group is set to be “ch” but this just lists them in the legend as 1, 2, 3, and 4 I have tried to change them through setting labels={“ch”:“Sensors”, “1”:“Sensor Name”} but that will change the Legend title and not the names of the lines.
Here’s the code from the callback:
@app.callback(Output('graph', 'figure'),
[Input('interval-component', 'n_intervals')])
def update_graph(n):
with open("file.json", "r") as read_file:
data = json.load(read_file)
return px.line(data, x="t", y="v", line_group="ch", color="ch", labels= "ch":"Sensors"}).update(layout=nlayout)
And here’s how I have the layout setup:
nlayout = { "title": "Sensor Data",
"xaxis":{
"title":"Time",
"type" : "date",
"autorange":True,
"rangeselector":{"buttons":[
{
"count": .01,
"label": "day",
"step" : "day",
"stepmode": "backward"
},
{
"count": 1,
"label": "1m",
"step": "month",
"stepmode" : "backward",
},
{
"count": 6,
"label": "6m",
"step" : "month",
"stepmode": "backward"
},
{
"count": 1,
"label": "year",
"step" : "year",
"stepmode": "todate"
},
{
"step":"all",
"label":"all"
},
]}
},
"yaxis":{
"title":"Volts",
"type":"linear"
},
"transition":{'duration': 300, 'easing': 'cubic-in-out'},
}