-1

首先非常感谢 Dash 帮助我摆脱了网络应用程序中的交互式绘图。

最近我正在制作一个需要经常更新数据的应用程序。

该应用程序现在可以从 mysql 获取数据并更新数据和图形。问题是我将间隔设置为 10 秒,而每 10 秒我也可以看到数据是在服务器中实现和计算的,但该数字只能在大约每 1 分钟到 50 秒随机更新一次。

每隔 10 秒,我可以在站点点击处看到更新,但直到 50 秒或 1 分钟,数据才更新。

此外,mysql服务器是本地的,查询时间快2.3ms左右。计算时间约为 100 ms。

这是我的应用程序的大部分代码。

""" app plotly dash"""
import dash
from dash.dependencies import Input, Output, State, Event
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
import numpy as np
import time
import sys
import datetime as dt
import matplotlib
matplotlib.use(“Agg”)
import matplotlib.pylab as plt
import base64
from login import server as server
import json

def global_store(data, strings):
    global_data = [v for i,v in enumerate(data)]
    print(‘Computing value…’)
    return [global_data, strings]

app = dash.Dash(name=‘app’, server=server, csrf_protect=False, 
    url_base_pathname=’/app’)

app.layout = html.Div([
html.Div([

    dcc.Interval(
        id='interval-component',
        interval=5*60*60*1000, # in milliseconds
        n_intervals=0
    ),

  html.Button(id='run', n_clicks=0, children='Run'),

  html.Div(id='signal', style={'display': 'none'}),
  html.Div(id='div-error'),
  ], style={'display': 'inline-block', 'textAlign': 'center', 
'marginLeft':'27%', 'marginTop':0}),

html.Div([
dcc.Slider(id='index-slider3', min=0, max=loops, value=0, step=1,),
], style={'width': '35%'}),

# Graphs

html.Div([
    html.H5("Waveform 1", style={'display': 'inline-block', 'marginLeft': 300}),
    dcc.Graph(id='fig1', style={'width':850, 'height': 450, 'marginTop':0, 'marginBottom':0}),],
style={'width': '60%', 'display': 'inline-block','marginTop': 0}),

html.Div([
    html.H5("Waveform 2", style={'display': 'inline-block', 'marginLeft': 300}),
    dcc.Graph(id='fig2', style={'width':850, 'height': 450, 'marginTop':0, 'marginBottom':0})],
style={'width': '60%', 'display': 'inline-block','marginTop': 0}),

html.Div([
    html.H5("Waveform 3", style={'display': 'inline-block', 'marginLeft': 300}),
    dcc.Graph(id='fig3', style={'width':850, 'height': 450, 'marginTop':0, 'marginBottom':0})],
style={'width': '60%', 'display': 'inline-block','marginTop': 0}),

html.Div([
    html.H5("Waveform 4", style={'display': 'inline-block', 'marginLeft': 300}),
    html.Img(id='fig4', style={'width':850, 'height': 450, 'marginTop':0, 'marginBottom':0})],
    style={'width': '60%', 'display': 'inline-block','marginTop': 0}),
])

@app.callback(Output(‘interval-component’, ‘interval’),
[Input(‘run’, ‘n_clicks’)])
def disable_interval(n_clicks):
    if n_clicks%2 == 0:
        return 106060*1000
    else:
        return 10 * 1000

@app.callback(Output(‘signal’, ‘children’),
[Input(‘interval-component’, ‘n_intervals’)],)
def compute_value(n_intervals):
    datas = np.random.randint(1000, size=5000)
    datass = np.random.randint(2, size=(5000,5000))
    plt.figure(figsize=(8, 6))
    plt.pcolormesh(datas [0:10], datass [10:100], datas [10:100,0:10])
    plt.colorbar()
    plt.title(‘Waveform at time: 
    {}.’.format(dt.datetime.now().strftime(’%c’)))
    plt.savefig(‘spectrum.png’)
    image_filename = ‘wave4.png’ # replace with your own image
    encoded_image = base64.b64encode(open(image_filename, ‘rb’).read())
    base64_string = encoded_image.decode(‘utf-8’)
    global_data = global_store(datas, base64_string)
    return json.dumps(global_data)

@app.callback(Output(‘div-error’, ‘children’), [Input(‘signal’, 
‘children’)], [], [Event(‘interval-component’, ‘interval’)])
def update_error(data):
      if ‘data’ in data:
           return data

@app.callback(Output(‘fig1’, ‘figure’), [Input(‘signal’, ‘children’)], [], 
[Event(‘interval-component’, ‘interval’)])
def update_figure1(data):
    data = json.loads(data)
    traces = []
    traces.append(go.Scatter(
    x=list(range(len(data[0]))),
    y=data[0],
    mode=‘lines’,#+markers’,
    opacity=0.7,
    ))
    return {
‘data’: traces,
‘layout’: go.Layout(
title=‘Waveform1’,
xaxis={‘title’: ‘Index’},
legend={‘x’: 0, ‘y’: 1},
hovermode=‘closest’
)
}

@app.callback(Output(‘fig2’, ‘figure’), [Input(‘signal’, ‘children’)], [], 
[Event(‘interval-component’, ‘interval’)])
def update_figure2(data):
    data = json.loads(data)
    traces = []
    traces.append(go.Scatter(
    x=list(range(len(data[0]))),
    y=data[0],
    mode=‘lines’,
    opacity=0.7,
    ))
    return {
    ‘data’: traces,
    ‘layout’: go.Layout(
    title=‘Waveform2’,
    legend={‘x’: 0, ‘y’: 1},
    hovermode=‘closest’
    )
    }

@app.callback(Output(‘fig3’, ‘figure’), [Input(‘signal’, ‘children’)], [], 
 [Event(‘interval-component’, ‘interval’)])
def update_figure5(data):
    data = json.loads(data)
    traces = []
    traces.append(go.Scatter(
    x=list(range(len(data[0]))),
    y= np.array(data[0]) * np.array(data[0]),
mode=‘line’,
name=“Power”,
))
return {
‘data’: traces,
‘layout’: go.Layout(
title=‘Waveform3’,
legend={‘x’: 0, ‘y’: 1},
hovermode=‘closest’
)
}

@app.callback(Output(‘fig4’, ‘src’), [Input(‘signal’, ‘children’)], [], [Event(‘interval-component’, ‘interval’)])
def update_figure6(data):
data = json.loads(data)
image = data[1]
return ‘data:image/png;base64,{}’.format(image.encode(‘utf-8’).decode())

if name == ‘main’:
app.run_server(host=‘0.0.0.0’, port=9000, debug=True)
# app.run_server()

” 这是服务器端的输出:

计算值… 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08 ] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update -component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - Theta 为:-0.30832596184310135 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [2018 年 3 月 20 日 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0。1 - - [20/Mar/2018 16:50:08] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:08] “POST /app2_dash -update-component HTTP/1.0” 200 - 4096.0 计算值... 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-组件 HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16 :50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - Theta 为:-0.17874378214618614 127.0.0。1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash -update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar /2018 16:50:18] “POST /app2_dash-update-component HTTP/1.0” 200 - 4096.0 计算值... 127.0.0.1 - - [20/Mar/2018 16:50:28] “POST /app2_dash-update-组件 HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:28] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16 :50:28] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:28] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:28] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:28]“POST /app2_dash-update-component HTTP/1.0”200 - Theta 为:-0.17874378214618614 127.0.0.1 - - [2018 年 3 月 20 日 16:50:28]“POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:28] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:28] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:29] “POST /app2_dash-update-component HTTP/1.0” 200 - 127.0.0.1 - - [20/Mar/2018 16:50:29] “POST /app2_dash-update-component HTTP/1.0” 200 -28]“POST /app2_dash-update-component HTTP/1.0”200 - 127.0.0.1 - - [20/Mar/2018 16:50:29]“POST /app2_dash-update-component HTTP/1.0”200 - 127.0.0.1 - - [20/Mar/2018 16:50:29] “POST /app2_dash-update-component HTTP/1.0” 200 -28]“POST /app2_dash-update-component HTTP/1.0”200 - 127.0.0.1 - - [20/Mar/2018 16:50:29]“POST /app2_dash-update-component HTTP/1.0”200 - 127.0.0.1 - - [20/Mar/2018 16:50:29] “POST /app2_dash-update-component HTTP/1.0” 200 -

啊,这是控制台中的一个警告:

/home/mo/anaconda3/envs/tf35/lib/python3.5/site-packages/matplotlib/pyplot.py:537:运行时警告:

已经打开了20多个数字。通过 pyplot 接口 (matplotlib.pyplot.figure) 创建的图形会一直保留到显式关闭,并且可能会消耗太多内存。(要控制此警告,请参阅 rcParam 图.max_open_warning)。

我个人认为这意味着每10秒计算一次数据和图像,但数字仍然不是每10秒更新一次。

你能帮我解决这个问题吗?太感谢了。此外,我想将间隔设置为 0.5 秒,有没有更好的方法来进行频繁更新?

参考:https ://community.plot.ly/t/help-interval-can-update-the-data-but-figure-not-updated-is-there-any-refresh-frequency-limit-in-dash/ 9089

4

1 回答 1

0

最后我发现问题是由数据库延迟引起的。数据库仅每 1 分钟更新一次数据。

于 2018-03-22T10:39:03.960 回答