Перезвоните в графике в реальном времени с несколькими трассами в Plotly Dash - PullRequest
Новая
       83

Перезвоните в графике в реальном времени с несколькими трассами в Plotly Dash

1 голос
/ 25 февраля 2020

как сделать график обновления в реальном времени с несколькими трассами в нем? Для каждого временного интервала мне нужно прочитать строку из «tmp.txt» в data ['prof'] и data ['pred'] и обновить в линейном графике.

Я нашел решение для live- обновление здесь (https://pythonprogramming.net/live-graphs-data-visualization-application-dash-python-tutorial/), но не показывает, как @ app.callback для нескольких трасс. Также я узнал, что он использует «Событие», которое устарело.

Моя кодировка следующая, спасибо, если кто-то может мне помочь. Спасибо. 

import dash
import dash_daq as daq
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
from collections import deque

def read():
    with open ("tmp.txt", "r") as f:
        for line in f:
            data=line.split(',')
    return data 

i=0

data =  { 'prof':deque(maxlen=120), 'pred': deque(maxlen=120) }

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

app.layout = html.Div(

        children=[
            dcc.Interval(id='timer', interval=1000),
            html.Br(),
            html.Div([  
                dcc.Graph(id='graph')
                ])
            ])

@app.callback(Output('graph','figure'), [Input('timer','n_intervals')])
def update_graph():
    data=read()
    data=read()
    X.append(i)
    data['prof'].append(float(data[1]))
    data['pred'].append(float(data[2]))

    figure={
        'data':[
            {'x':X,'y':CPU['prof'],'type':'scatter','name':'Profiled'},
            {'x':X,'y':CPU['pred'],'type':'scatter','name':'Predicted'}
            ]}
    i+=1
    return figure

Редактировать: 'tmp.txt' - это файл, постоянно перезаписываемый другой программой. Он имеет только одну строку, как показано ниже: «3,2233 4,33445», 32, 74,0, 0,13, 0,0, 0,0

.

1 Ответ

1 голос
/ 26 февраля 2020

После проб и ошибок, наконец, я пришел к решению, используя plotly.graph_ob js: 

   ....
   dcc.Interval(id='timer', interval=1000),
   html.Div([
            dcc.Graph(id='graph', animate=True),
            ], 
    ....

для обратного вызова: 

@app.callback(Output('graph', 'figure'),
    [Input('timer', 'n_intervals')])
def update_graph_scatter(n):
    data=read()
    X.append(X[-1]+1)
    data['prof'].append(float(data[1]))
    data['pred'].append(float(data[2]))

    data = [go.Scatter(
            x=list(X),
            y=list(CPU['prof']),
            name='Prof',
            mode= 'lines+markers'
            ),
            go.Scatter(
            x=list(X),
            y=list(data['pred']),
            name='Pred',
            mode= 'lines+markers'
            ),
            ]

    return {'data': data,'layout' : go.Layout(xaxis=dict(range=[min(X),max(X)]),
                                                yaxis=dict(range=[0,380]))}
...