使用Python Dash 和 Plotly 绘制实时图

Python Dash 和 Plotly 是两个强大的 Python 模块，可以用于数据可视化和流程处理。在本文中，我们将介绍如何使用 Python Dash 和 Plotly 绘制实时图。

安装 Python Dash 和 Plotly

我们可以使用 pip 工具来安装 Python Dash 和 Plotly：

pip install dash plotly

创建一个简单的实时图表

首先，我们将创建一个简单的 Python Dash 应用程序，它将显示一个 Plotly 图表，并在每秒更新一次。我们将在这个应用程序中使用 Plotly 的实时图表功能。

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objs as go
import random

# 创建一个 Dash 应用程序
app = dash.Dash(__name__)

# 定义图表的数据和布局
data = [go.Scatter(x=[0], y=[0], mode='lines', name='随机数')]
layout = go.Layout(title='实时图表', xaxis=dict(title='时间'), yaxis=dict(title='值'))

# 创建一个回调函数，用于更新图表数据
@app.callback(Output('实时图表', 'figure'), [Input('interval-component', 'n_intervals')])
def update_graph(n):
    # 生成随机数
    x = random.randint(0, 100)
    y = random.randint(0, 100)
    # 更新图表数据
    data[0]['x'].append(n)
    data[0]['y'].append(x)
    # 如果数据过多，则只显示最近的 data_points 个点
    data_points = 20
    if len(data[0]['y']) > data_points:
        data[0]['x'] = data[0]['x'][-data_points:]
        data[0]['y'] = data[0]['y'][-data_points:]
    # 返回更新后的图表
    return {'data': data, 'layout': layout}

# 创建一个应用程序布局
app.layout = html.Div(children=[
    html.H1(children='实时图表'),
    dcc.Graph(id='实时图表', figure={'data': data, 'layout': layout}),
    dcc.Interval(id='interval-component', interval=1000, n_intervals=0)
])

# 运行应用程序
if __name__ == '__main__':
    app.run_server(debug=True)

解释代码

这个应用程序有一个图表，它将在每秒更新一次。我们将在这个应用程序中使用 Plotly 的实时图表功能。

图表的数据由一个 data 列表和一个 layout 对象组成。 data 列表包含一个随机数的 Scatter 对象，它将在每秒更新一次。 layout 对象定义图表的名称和坐标轴的名称。

data = [go.Scatter(x=[0], y=[0], mode='lines', name='随机数')]
layout = go.Layout(title='实时图表', xaxis=dict(title='时间'), yaxis=dict(title='值'))

应用程序主体由一个回调函数定义，它用于更新图表数据。在这个应用程序中我们没有使用 Flask，而是使用了 Dash 的回调函数。这个回调函数基于一个名为 n_intervals 的输入，它每秒自增一次。每个回调函数都必须返回一个包含 data 和 layout 对象的字典，这些对象将被用于更新图表。

@app.callback(Output('实时图表', 'figure'), [Input('interval-component', 'n_intervals')])
def update_graph(n):
    # 生成随机数
    x = random.randint(0, 100)
    y = random.randint(0, 100)
    # 更新图表数据
    data[0]['x'].append(n)
    data[0]['y'].append(x)
    # 如果数据过多，则只显示最近的 data_points 个点
    data_points = 20
    if len(data[0]['y']) > data_points:
        data[0]['x'] = data[0]['x'][-data_points:]
        data[0]['y'] = data[0]['y'][-data_points:]
    # 返回更新后的图表
    return {'data': data, 'layout': layout}

最后，我们定义一个应用程序布局，它包含一个标题和一个图表。图表是由 dcc.Graph 组件创建的。

app.layout = html.Div(children=[
    html.H1(children='实时图表'),
    dcc.Graph(id='实时图表', figure={'data': data, 'layout': layout}),
    dcc.Interval(id='interval-component', interval=1000, n_intervals=0)
])

运行应用程序

如需运行上面的应用程序，请执行以下命令：

python app.py

然后在浏览器中打开 http://127.0.0.1:8050/ 访问应用程序。

总结

在本文中，我们介绍了如何使用 Python Dash 和 Plotly 绘制实时图。我们创建了一个简单的 Python Dash 应用程序，它显示一个实时的 Plotly 图表，并在每秒更新一次。希望这篇文章对你有所帮助！