PyQt5 Qt Designer 使用Qchart画图显示动态曲线
源码示例下载
传送门
效果图：
导入pyqt5库：
pip install PyQt5==5.15.4 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install pyqt5-plugins==5.15.4.2.2 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install PyQt5-Qt5==5.15.2 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install PyQt5-sip==12.9.1 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install PyQt5-stubs==5.15.2.0 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install pyqt5-tools==5.15.4.3.2 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install python-dotenv==0.20.0 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install qt5-applications==5.15.2.2.2 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install qt5-tools==5.15.2.1.2 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install numpy==1.21.6 -i https://pypi.tuna.tsinghua.edu.cn/simple
一、使用QtChart
1、导入库
pip install PyQtChart==5.15.5 -i https://pypi.tuna.tsinghua.edu.cn/simple
2、打开Qt Designer
创建一个Main Windows:
保存，命名为dym_plot_qchart.ui
3、添加按钮控件
添加一个按钮控件pushButton，在右侧objectName命名为btn_start
保存。
4、添加图形控件
添加一个图形控件Graphics View，在右侧objectName命名为plot_view
保存。
选中Graphics View，右键，选择提升为...，其中提升的类名称：QChartView，头文件：PyQt5.QtChart，如下图：
添加后，点击提升，然后保存。
5、使用pyuic5.exe把ui转py
使用pyuic5.exe把dym_plot_qchart.ui转dym_plot_qchart.py:
转成功后，dym_plot_qchart.py代码如下：
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'dym_plot_qchart.ui'
#
# Created by: PyQt5 UI code generator 5.15.4
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again. Do not edit this file unless you know what you are doing.
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
MainWindow.setObjectName("MainWindow")
MainWindow.resize(800, 600)
self.centralwidget = QtWidgets.QWidget(MainWindow)
self.centralwidget.setObjectName("centralwidget")
self.btn_start = QtWidgets.QPushButton(self.centralwidget)
self.btn_start.setGeometry(QtCore.QRect(40, 50, 93, 28))
self.btn_start.setObjectName("btn_start")
self.plot_view = QChartView(self.centralwidget)
self.plot_view.setGeometry(QtCore.QRect(20, 130, 751, 281))
self.plot_view.setObjectName("plot_view")
MainWindow.setCentralWidget(self.centralwidget)
self.menubar = QtWidgets.QMenuBar(MainWindow)
self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 26))
self.menubar.setObjectName("menubar")
MainWindow.setMenuBar(self.menubar)
self.statusbar = QtWidgets.QStatusBar(MainWindow)
self.statusbar.setObjectName("statusbar")
MainWindow.setStatusBar(self.statusbar)
self.retranslateUi(MainWindow)
QtCore.QMetaObject.connectSlotsByName(MainWindow)
def retranslateUi(self, MainWindow):
_translate = QtCore.QCoreApplication.translate
MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
self.btn_start.setText(_translate("MainWindow", "开始"))
from PyQt5.QtChart import QChartView
6、创建一个dym_plot_qchart_main.py
在dym_plot_qchart.py同级目录下创建一个dym_plot_qchart_main.py函数，用来启动PyQt5界面。
代码如下：
# !/usr/bin/python
# -*- coding: utf-8 -*-
"""
@contact: 微信 1257309054
@file: main_das.py
@time: 2022/3/25 14:27
@author: LDC
"""
import json
import time
import numpy as np
import sys
from PyQt5.Qt import *
from dym_plot_qchart import Ui_MainWindow
from PyQt5.QtChart import QChart, QValueAxis, QChartView, QSplineSeries
class Window(QMainWindow, Ui_MainWindow):
def __init__(self, app):
super(QMainWindow, self).__init__()
self.app = app
self.setup_ui() # 渲染画布
self.update_data_thread = UpdateDataThread() # 创建更新波形数据线程
self.connect_signals() # 绑定触发事件
def setup_ui(self):
self.setupUi(self) # 调用Ui_MainWindow的setupUi渲染界面
# 加载Qchart波形界面
self.plot_qchart = QChartViewPlot()
self.plot_view.setChart(self.plot_qchart)
self.plot_view.setRenderHint(QPainter.Antialiasing) # 抗锯齿
self.plot_view.setRubberBand(QChartView.RectangleRubberBand)
def connect_signals(self):
# 绑定触发事件
self.btn_start.clicked.connect(self.btn_start_clicked)
self.update_data_thread._signal_update.connect(self.update_data_thread_slot)
def btn_start_clicked(self):
# 开启按钮
self.update_data_thread.start()
def update_data_thread_slot(self, data):
# 线程回调函数
data = json.loads(data)
self.plot_qchart.handle_update(data['sin_data'])
def wheelEvent(self, event):
# 鼠标滚轮:缩放Qchart波形
if event.angleDelta().y() >= 0:
# 鼠标滚轮向上
if event.x() < (
self.plot_view.width() + self.plot_view.x()) and event.x() > self.plot_view.x():
if event.y() < (
self.plot_view.height() + self.plot_view.y()) and event.y() > self.plot_view.y():
self.plot_qchart.zoomIn()
else:
# 鼠标滚轮向下
if event.x() < (
self.plot_view.width() + self.plot_view.x()) and event.x() > self.plot_view.x():
if event.y() < (
self.plot_view.height() + self.plot_view.y()) and event.y() > self.plot_view.y():
self.plot_qchart.zoomOut()
# 波形显示
class QChartViewPlot(QChart):
# 相位振动波形
def __init__(self, parent=None):
super(QChartViewPlot, self).__init__(parent)
self.window = parent
self.xRange = 1024
self.counter = 0
self.seriesList = []
self.legend().show()
self.axisX = QValueAxis()
self.axisX.setRange(0, self.xRange)
self.addAxis(self.axisX, Qt.AlignBottom)
# self.setAxisX(self.axisX, series)
self.y_min = 0
self.y_max = 100
self.axisY = QValueAxis()
self.axisY.setRange(self.y_min, self.y_max)
self.addAxis(self.axisY, Qt.AlignLeft)
# self.setAxisY(self.axisY, series)
self.series = QSplineSeries()
self.series.setName("波形")
self.series.setUseOpenGL(True)
self.addSeries(self.series)
self.series.attachAxis(self.axisX)
self.series.attachAxis(self.axisY)
def handle_update(self, ydata):
# 更新y值
if self.counter < self.xRange:
self.series.append(self.counter, ydata)
self.counter += 1
else:
points = self.series.pointsVector()
for i in range(self.xRange - 1):
points[i].setY(points[i + 1].y())
points[-1].setY(ydata)
self.y_min = min(points, key=lambda point: point.y()).y()
self.y_max = max(points, key=lambda point: point.y()).y()
self.series.replace(points)
self.axisY.setRange(self.y_min - 20, self.y_max + 20)
# 使用线程不断更新波形数据
class UpdateDataThread(QThread):
_signal_update = pyqtSignal(str) # 信号
def __init__(self, parent=None):
super(UpdateDataThread, self).__init__(parent)
self.qmut = QMutex()
self.is_exit = False
self.x_range = 1024
self.sin = Sin()
def run(self):
while True:
self.qmut.lock()
if self.is_exit:
break
self.qmut.unlock()
for i in range(self.x_range):
self._signal_update.emit(json.dumps({'sin_data': self.sin.get_data(i)})) # 发送信号给槽函数
time.sleep(0.01)
self.qmut.unlock()
class Sin():
# 创建一个正弦波数据
def __init__(self, pha=0):
self.pha = pha # 初始相位
def get_data(self, index):
self.pha += 10
if self.pha > 1000:
self.pha = 0
return 1000 * np.sin(8 * np.pi * index + self.pha * np.pi / 180.0)
def main():
app = QApplication(sys.argv)
mywindow = Window(app)
mywindow.show()
sys.exit(app.exec_())
if __name__ == "__main__":
main()
运行dym_plot_qchart_main.py，点击开始：
源码示例下载
传送门
公众号
关注我，我们一起成长~~
