1、实现效果
2、环境:
确认已经安装pyqtgraph
的模块,如果没有安装,使用命令安装:
pip install pyqtgraph
3、代码实现:
绘制折线函数:
import sys
import random
from PySide6.QtWidgets import QApplication, QGraphicsView, QGraphicsScene, QGraphicsItem
from PySide6.QtCore import Qt, QPointF, QRectF, QTimer
from PySide6.QtGui import QPainter, QPen, QColor, QFont
class ScrollableLineGraph(QGraphicsItem):
def __init__(self, data):
"""
初始化线图项,设置初始显示范围和数据
:param data: 要显示的数据列表
"""
super().__init__()
self.data = data
self.current_start = 0 # 当前显示的起始索引
self.bounding_rect = QRectF(0, 0, 900, 200) # 线图的边界矩形
def boundingRect(self):
"""
返回线图的边界矩形,用于确定绘制区域
:return: 矩形边界
"""
return self.bounding_rect
def paint(self, painter, option, widget):
"""
绘制线图,包括坐标轴、刻度和数据线
:param painter: 绘制工具
:param option: 绘制选项
:param widget: 关联的窗口部件
"""
painter.setRenderHint(QPainter.Antialiasing) # 开启抗锯齿
axis_pen = QPen(QColor(255, 255, 255)) # 坐标轴线颜色
line_pen = QPen(QColor(255, 0, 0)) # 数据线颜色
text_font = QFont() # 字体设置
# 绘制x轴
painter.setPen(axis_pen)
painter.drawLine(0, 200, 900, 200)
# 绘制x轴刻度和标签
for i in range(0, 20, 1):
x = (i - self.current_start) * 45
if 0 <= x < 900:
painter.drawLine(x, 200, x, 210)
painter.drawText(x - 5, 220, str(i + self.current_start))
# 绘制y轴
painter.drawLine(0, 0, 0, 200)
# 绘制y轴刻度和标签
for i in range(0, 5):
y = 200 - 45 * i
painter.drawLine(-5, y, 0, y)
painter.drawText(-20, y - 5, str(i * 20)) #10:表示Y坐标值间隔大小
# 绘制y轴刻度和标签,给每个标签添加上横向网格,网格为点状虚线
for i in range(0, 5):
y = 200 - 45 * i
# 网格为点状虚线
painter.setPen(QPen(QColor(128, 128, 128), 0.5, Qt.DashLine))
# painter.drawLine(-5, y, 0, y)
# painter.drawText(-20, y - 5, str(i * 10))
painter.drawLine(0, y, 900, y)
# 假设已经初始化了painter对象等必要的准备工作
# 定义一些常量,提高代码的可读性
CANVAS_HEIGHT = 200
SCALE_FACTOR = 45
LABEL_OFFSET = -20
GRID_LINE_WIDTH = 0.5
GRID_LINE_COLOR = QColor(128, 128, 128)
GRID_LINE_STYLE = Qt.DashLine
MAX_LABELS = 10
# 新增:封装绘制网格线和刻度标签的函数
def draw_scale_and_grid(painter, y_position, label):
"""
绘制y轴刻度和标签以及对应的横向网格线
:param painter: QPainter对象,用于绘制
:param y_position: y轴位置
:param label: 刻度标签的文本
"""
try:
# 绘制网格线
painter.setPen(QPen(GRID_LINE_COLOR, GRID_LINE_WIDTH, GRID_LINE_STYLE))
painter.drawLine(-5, y_position, 0, y_position)
# 绘制刻度标签
painter.drawText(-LABEL_OFFSET, y_position - 5, label)
# 绘制右侧网格线
painter.drawLine(0, y_position, 900, y_position)
except Exception as e:
print(f"Error during drawing scale and grid: {e}")
# 主绘制逻辑
try:
for i in range(MAX_LABELS + 1): # 由于范围是从0到10,因此循环次数应为MAX_LABELS + 1
y = CANVAS_HEIGHT - SCALE_FACTOR * i
# 检查y位置是否在画布内,若不在则跳过
if y < 0:
break
label = str(i * 10)
# draw_scale_and_grid(painter, y, label)
except Exception as e:
print(f"Unexpected error occurred: {e}")
# 假设在这段代码的末尾,有适当的资源释放逻辑,例如painter对象的销毁等
# 设置字体
painter.setFont(text_font)
# 绘制x轴和y轴标签
painter.drawText(900, 205, "Time")
painter.rotate(-90)
painter.drawText(-30,10, "Value")
painter.rotate(90)
# 绘制数据线
painter.setPen(line_pen)
painter.setRenderHint(QPainter.SmoothPixmapTransform)
last_point = QPointF(0, 200 - self.data[self.current_start])
for i in range(self.current_start, min(self.current_start + 50, len(self.data))):
x = (i - self.current_start) * 45
y = 200 - self.data[i]
painter.drawLine(last_point, QPointF(x, y))
last_point = QPointF(x, y)
在QT Designer的Widget页面添加Graphics View,命名为graphicsView
在页面类中定义图表初始化和数据更新方法:
def GraphWidget_uiInit(self):
data = []
scene = QGraphicsScene(self.graphicsView)
self.graphicsView.setScene(scene)
self.data_graph = ScrollableLineGraph(data)
scene.addItem(self.data_graph)
scene.setBackgroundBrush
self.graphicsView.setRenderHint(QPainter.Antialiasing)
self.graphicsView.setFixedSize(960, 240)
self.graphicsView.setSceneRect(0, 0, 900, 220)
self.graphicsView.setHorizontalScrollBarPolicy(Qt.ScrollBarAsNeeded)
# # 设置定时器,用于动态更新数据
# self.timer = QTimer(self)
# self.timer.timeout.connect(self.update_data)
# self.timer.start(60) # 每500毫秒触发一次
def update_data(self):
#随机数据
# new_data = random.randint(0, 100)
# self.data_graph.data.append(new_data)
#将字符串数据转换成int类型的列表数据
dataStr8 = "100 30 178 100 69 60 98 98 79 50 30 20 29 58 69 39 98 29 32"
list_from_string8 = dataStr8.split()
number_list8 = list(map(int, list_from_string8))
self.data_graph.data = number_list8
self.data_graph.current_start = max(0, len(self.data_graph.data) - 50)
self.data_graph.update()
参考博文:https://blog.csdn.net/hyd_csdn/article/details/140644014