QT案例-通过QCustomPlot库绘制Window系统CPU温度实时折线图

已于 2024-07-15 10:14:47 修改
阅读量2.5k 收藏 44
点赞数 17
CC 4.0 BY-SA版权
分类专栏： QT专栏 文章标签： qt QCustomPlot CPU温度
于 2024-07-08 16:50:03 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_35554617/article/details/140266832

之前项目中涉及到了获取硬件信息内容，对CPU的温度监控有点兴趣，观察和百度发现鲁大师和驱动人生的CPU温度监控貌似是用驱动实现的，有点太高大上了，搞不懂。后面经过到处查找资料终于找到了Qt在Windows 环境下监控CPU等硬件温度/运行速度等信息的解决方法。
这一篇注意介绍QCustomPlot库绘制每两秒获取的CPU温度数据：
根据获取的Window系统的CPU温度数据，使用QCustomPlot库绘制温度折线图，包括实现x轴时间线，折现背景渐变绘图，获取温度值，每两秒实时显示温度，等涉及的QCustomPlot库的使用。

目录导读

QCustomPlot库简要介绍(文言一心)

QCustomPlot是一个功能强大、易于使用的Qt C++图形库，它提供了丰富的API和强大的功能，非常适合用于创建各种2D图形和进行数据可视化。无论是静态图形还是实时数据可视化，
QCustomPlot都能提供出色的性能和效果。
基本概述：

  • 功能定位：QCustomPlot是一个用于创建静态或实时2D图形的C++类库，构建在Qt应用框架之上，提供了一套丰富的API用于创建各种常见的2D图形，包括散点图、曲线图、条形图、饼图、直方图等。
  • 特点：QCustomPlot没有进一步的依赖关系，并且有据可查。它专注于制作美观、出版质量的2D绘图、图形和图表，以及为实时可视化应用程序提供高性能服务。
  • 兼容性：QCustomPlot建立了高达Qt 6.0的兼容性（保持兼容性一直到4.6），并包括许多功能添加、错误修复和较小的改进。它需要C++11支持。

主要特性：
1. 支持多种图形类型： QCustomPlot支持各种类型的2D图形，如线图、散点图、条形图、饼图、直方图等。
2. 数据可视化： 支持多种数据可视化形式，如颜色映射、水平线、垂直线等。
3. 自定义轴： 用户可以在QCustomPlot中自定义轴的范围、标签、刻度线等。
4. 高亮显示和注释： 可以高亮显示图形中的特定部分，并添加注释。
5. 交互性： 支持图形的缩放、平移、选择和鼠标悬停等交互操作。
6. 实时更新： 可以实时更新图形，非常适合展示动态数据。
7. 输出功能： 用户可以将QCustomPlot中的图形保存为各种格式的图像文件（如PDF、PNG、JPG、BMP等），或直接打印出来。
8. 图层控制： 支持多图层绘制，用户可以控制各个图层的顺序和可见性。
9. 自定义图例： 可以自动为用户创建的图形创建图例，用户也可以完全控制图例的样式和位置。

使用参考：
QCustomPlot绘图类详解（大白话）
QCustomPlot 官网

示例是Window系统环境， 使用 Qt Creator 5.13.1 和Mscv2022编译器使用QCustomPlot 库绘制折线图，
只需要引用qcustomplot.h和qcustomplot.cpp文件，
以及在Pro文件中添加QT += printsupport 就能直接绘制。

功能描述

根据第三方库每两秒获取的Window系统的CPU温度数据 ，使用QCustomPlot 库绘制温度折线图。

绘制样式一

参考官方interaction示例完成以下样式：
在这里插入图片描述

QCustomPlot 控件样式具体实现

  • 添加 表格边框线、启用图例等默认配置
//! 表格边框线
customPlot->xAxis->grid()->setSubGridPen(QPen(QColor(80, 80, 80), 1, Qt::DotLine));
customPlot->yAxis->grid()->setSubGridPen(QPen(QColor(80, 80, 80), 1, Qt::DotLine));
customPlot->xAxis->grid()->setSubGridVisible(true);
customPlot->yAxis->grid()->setSubGridVisible(true);

//! 设置 坐标轴是否可选，图例是否可选 实例是否可选
customPlot->setInteractions( QCP::iSelectLegend | QCP::iSelectPlottables);

//! 设置一个默认范围
customPlot->xAxis->setRange(QDateTime::currentSecsSinceEpoch()-120, QDateTime::currentSecsSinceEpoch());
customPlot->yAxis->setRange(0, 100);

//! 完全填充
customPlot->axisRect()->setupFullAxesBox();

customPlot->xAxis->setLabel("时间(S)");
customPlot->yAxis->setLabel("温度(℃)");

//! 启用图例
customPlot->legend->setVisible(true);
//    QFont legendFont = font();
//    legendFont.setPointSize(10);
//    ui->customPlot->legend->setFont(legendFont);
//    ui->customPlot->legend->setSelectedFont(legendFont);
customPlot->legend->setSelectableParts(QCPLegend::spItems); // legend box shall not be selectable, only legend items
customPlot->axisRect()->insetLayout()->setInsetAlignment(0, Qt::AlignTop|Qt::AlignLeft);

//! 设置一个绘图标题
customPlot->plotLayout()->insertRow(0);
QCPTextElement *title = new QCPTextElement(customPlot, "CPU Temperature", QFont("sans", 17, QFont::Bold));
customPlot->plotLayout()->addElement(0, 0, title);
  • 设置 X轴显示时间

设置X轴为时间轴，此时X轴数据对应值为 [QDateTime::currentSecsSinceEpoch()] ：

 QSharedPointer<QCPAxisTickerDateTime> dateTicker(new QCPAxisTickerDateTime);
  dateTicker->setDateTimeSpec(Qt::LocalTime); // 设置日期和时间规范为协调世界时（UTC）
  dateTicker->setTickCount(5); // 设置刻度数量
  dateTicker->setDateTimeFormat("yyyy-MM-dd \n hh:mm:ss");
  customPlot->xAxis->setTicker(dateTicker);

值得注意的是：使用毫秒时间戳[QDateTime::currentMSecsSinceEpoch()]时,X轴转换成时间会混乱，而使用秒[QDateTime::currentSecsSinceEpoch()]X轴时间正常，
但是参考：qcustomplot使用&x轴显示时间 毫秒值是正常的，不知道是不是Qt版本的问题。

  • 添加 竖线分割线和显示内容文字框

在QCustomPlot绘图中添加一条根据鼠标移动移动的竖线(QCPItemLine)；
和添加一个点击显示内容的文字框(QCPItemText) 同时绑定到竖线的左侧显示：

	//! 初始化 一个分割线 用于定位鼠标位置
   QPointer<QCPItemLine> Service_Line=new QCPItemLine(customPlot);
    // 设置线的起点为 (5, 0)（注意这里的0可能是Y轴的最小值，也可能是其他值，取决于你的需求）
    Service_Line->start->setType(QCPItemPosition::ptPlotCoords);
    qint64 Line_x=QDateTime::currentSecsSinceEpoch()+5;
    Service_Line->start->setCoords(Line_x, 0); // X=5, Y轴最小值处
    // 设置线的终点为 (5, 1)（这里的1表示Y轴的最大值，使用轴的比例坐标）
    Service_Line->end->setType(QCPItemPosition::ptPlotCoords);
    Service_Line->end->setCoords(Line_x, 100); // X=5, Y轴最大值处

    // 设置线的颜色和线宽等属性（可选）
    Service_Line->setPen(GetCPItemLinePen(customPlot->size())); // 红色，线宽为2
    Service_Line->setVisible(true);

    //!初始化 一个文本框
    QPointer<QCPItemText> Service_Text= new QCPItemText(customPlot);//在QCustomplot中新建文字框
    Service_Text->setPositionAlignment(Qt::AlignRight|Qt::AlignTop);//文字布局：顶、左对齐
    Service_Text->position->setType(QCPItemPosition::ptAxisRectRatio);//位置类型（当前轴范围的比例为单位/实际坐标为单位）
    Service_Text->position->setCoords(0.4, 0.05); //把文字框放在X轴的中间，Y轴的最顶部
    Service_Text->setText("Text Item Demo");
    Service_Text->setPen(QPen(Qt::white)); //字体颜色
    Service_Text->setPadding(QMargins(2,2,2,2));
    Service_Text->position->setParentAnchorX(Service_Line->anchor("start"));
    Service_Text->setColor(Qt::white);
    Service_Text->setBrush(QColor("#383F5B"));
    Service_Text->setVisible(false);

参考：QCustomPlot系列(6)-在图中插入文本框/直线箭头/图片/矩形/椭圆/游标等

  • 使用QLinearGradient 实现渐进效果：
    给(QCPItemLine)竖线添加一个从上到下，从白色到黑色在到白色的渐进效果画笔；
QPen InitPlotDefaultStyle::GetCPItemLinePen(QSize size)
{
    //! 设置渐进
    //! 因为 QLinearGradient 需要设置高度大小 所以需要动态修改，参考：
    //! QGradient（渐变填充）： https://blog.youkuaiyun.com/qq_45303986/article/details/127934344
    //!
    QLinearGradient gradient(0, 15, 0, size.height()-25); // 从 (0,0) 到 (100,100) 的渐变
    gradient.setColorAt(0, QColor(255, 255, 255, 0));
    gradient.setColorAt(0.5, Qt::black);
    gradient.setColorAt(1, QColor(255, 255, 255, 0));
    // 创建一个 QBrush 并设置渐变
    QBrush brush(gradient);

    QPen Pen;
    Pen.setColor(Qt::black);
    Pen.setWidth(3);
    Pen.setBrush(brush);
    return Pen;
}

注意：
在使用QLinearGradient 实现渐变效果时，需要设置QCustomPlot控件的高度，这意味着需要在QCustomPlot控件大小发生变化时，刷新画笔；
需要在QCustomPlot 控件的resizeEvent事件中添加一个resizeChange信号

/*! \internal
  
  Event handler for a resize of the QCustomPlot widget. The viewport (which becomes the outer rect
  of mPlotLayout) is resized appropriately. Finally a \ref replot is performed.
*/
void QCustomPlot::resizeEvent(QResizeEvent *event)
{
  Q_UNUSED(event)
  // resize and repaint the buffer:
  setViewport(rect());
  replot(rpQueuedRefresh); // queued refresh is important here, to prevent painting issues in some contexts (e.g. MDI subwindow)

  // update add 
  emit resizeChange(event->size());
}

然后绑定信号实时修改绘制的画笔：


//! 控件大小改变
//connect(customPlot,&QCustomPlot::resizeChange,this,&InitPlotDefaultStyle::Slots_resizeChange);
void InitPlotDefaultStyle::Slots_resizeChange(QSize size)
{
	if(!Service_Line.isNull())
	    Service_Line->setPen(GetCPItemLinePen(size));

	//! 折线图下面的渐变
	for(int i=0;i<graphs.count();i++)
	{
	    graphs[i]->setBrush(GetGraphsBrush(customPlot->size(),colorPen[i]));
	}
}
  • 设置 从折线向下的一个渐变背景

同样使用QLinearGradient 实现折线到白色透明的一个渐变，同时在大小改变 resizeChange信号时刷新画笔刷子；

QBrush InitPlotDefaultStyle::GetGraphsBrush(QSize size,QColor color)
{
    //! 创建渐进效果
    QLinearGradient gradient(0, 10, 0, size.height()-20); // 从 (0,0) 到 (100,100) 的渐变
    gradient.setColorAt(0, color); // 起点颜色为红色
    gradient.setColorAt(1, QColor(255, 255, 255, 0)); // 终点颜色为透明
    //! 创建一个 QBrush 并设置渐变
    QBrush brush(gradient);
    return brush;
}
  • 初始化绘图 QCPGraph类

初始化每个CPU核心对应的QCPGraph绘图，并随机颜色，设置绘图图层和渐变效果。

void InitPlotDefaultStyle::InitGrap(QStringList keys)
{
    KeysV.clear();
    //! 记录每条折线图对映画笔颜色，用于渐变
    colorPen.clear();
    //! 保存每个折线的 QCPGraph*
    graphs.clear();

    //! 图例名称
    KeysV.append(keys);
    for(int i=0;i<KeysV.count();i++)
    {
        QCPGraph *graph1 = customPlot->addGraph();

        //! 随机颜色
        QColor pencolor=QColor(std::rand()%245+10, std::rand()%245+10, std::rand()%245+10);
        colorPen.append(pencolor);

        //! 设置画笔
        QPen graphPen;
        graphPen.setColor(pencolor);
        graphPen.setWidthF(2);
        graph1->setPen(graphPen);
        //!  圆点
        graph1->setScatterStyle(QCPScatterStyle(QCPScatterStyle::ssCircle, QPen(Qt::black, 1.5), QBrush(Qt::white), 2));
        //! 随机点样式
//        if (std::rand()%100 > 50)
//        graph1->setScatterStyle(QCPScatterStyle((QCPScatterStyle::ScatterShape)(std::rand()%14+1),5));

        //! 设置渐进绘图 从线向下绘图
        graph1->setBrush(GetGraphsBrush(customPlot->size(),pencolor));
        graph1->setName(KeysV[i]);
        graph1->setLineStyle((QCPGraph::lsLine));

        //! 设置所在图层
        customPlot->addLayer(QString(KeysV[i]).toStdString().c_str(), customPlot->layer("main"), QCustomPlot::limAbove);
        graph1->setLayer(QString(KeysV[i]).toStdString().c_str());

        graphs.append(graph1);
    }
    customPlot->replot();

}
  • 绑定数据

绑定每两秒监测线程传来的数据,

void InitPlotDefaultStyle::AddDataToCpuKeyValue(qint64 row,QList<double> Data)
{
    customPlot->xAxis->setRange(row,120, Qt::AlignRight);
    for (int i = 0; (i < Data.count() && i < customPlot->graphCount()); ++i) {
        customPlot->graph(i)->addData(row, Data[i]);
    }
    customPlot->replot();
}

值得注意的是设置X轴的 setRange 使最新的内容始终显示在最右边，
120为整个x轴显示间隔120秒内的数据：
customPlot->xAxis->setRange(row,120, Qt::AlignRight);
row 为 QDateTime::currentSecsSinceEpoch() 数据。

绘制样式二

参考官方的axis-tags示例完成以下样式，显示CPU最新温度：
在这里插入图片描述

在上面 QCustomPlot 控件样式的基础上进行修改

  • 修改 初始化绘图 QCPGraph类
void InitPlotDetailStyle::InitGrap(QStringList keys)
{

    KeysV.clear();
    colorPen.clear();
    graphs.clear();
    KeysV.append(keys);
    for(int i=0;i<KeysV.count();i++)
    {
//        customPlot->axisRect()->axis(QCPAxis::atRight, i)->setPadding(30);
        QCPGraph *graph1 = customPlot->addGraph();

        //! 随机颜色
        QColor pencolor=QColor(std::rand()%245+10, std::rand()%245+10, std::rand()%245+10);
        colorPen.append(pencolor);

        //! 设置画笔
        QPen graphPen;
        graphPen.setColor(pencolor);
        graphPen.setWidthF(2);
        graph1->setPen(graphPen);

        QCPAxis * tagAxis= customPlot->axisRect()->addAxis(QCPAxis::atRight);
        tagAxis->setRange(0,100);
        tagAxis->setTickLabels(false);
        tagAxis->setPadding(55);
        // create tags with newly introduced AxisTag class (see axistag.h/.cpp):
        AxisTag* mTag1 = new AxisTag(tagAxis);
        mTag1->setPen(graphPen);
        //! QList<QPointer<AxisTag>>
        graphs_AxisTag.append(mTag1);

        //!  圆点
        graph1->setScatterStyle(QCPScatterStyle(QCPScatterStyle::ssCircle, QPen(Qt::black, 1.5), QBrush(Qt::white), 2));
        //! 随机点样式
//        if (std::rand()%100 > 50)
//        graph1->setScatterStyle(QCPScatterStyle((QCPScatterStyle::ScatterShape)(std::rand()%14+1),5));

        //! 设置渐进绘图 从线向下绘图
        graph1->setBrush(GetGraphsBrush(customPlot->size(),pencolor));
        graph1->setName(KeysV[i]);
        graph1->setLineStyle((QCPGraph::lsLine));

        //! 设置所在图层
        customPlot->addLayer(QString(KeysV[i]).toStdString().c_str(), customPlot->layer("main"), QCustomPlot::limAbove);
        graph1->setLayer(QString(KeysV[i]).toStdString().c_str());

        graphs.append(graph1);
    }
    customPlot->replot();

}

AxisTag 类是官方示例中的 "axistag.h"文件中的类，
与上面初始化QCPGraph类 不同的是
每添加一条折线图就需要在右边添加一个Y轴,并赋值给AxisTag类:
customPlot->axisRect()->addAxis(QCPAxis::atRight)

  • 绑定数据

修改绑定数据的同时，修改 AxisTag类的值；

void InitPlotDetailStyle::AddDataToCpuKeyValue(qint64 row,QList<double> Data)
{
    customPlot->xAxis->setRange(row,120, Qt::AlignRight);
    for (int i = 0; (i < Data.count() && i < customPlot->graphCount()); ++i) {
        customPlot->graph(i)->addData(row, Data[i]);

        graphs_AxisTag[i]->updatePosition(Data[i]);
        graphs_AxisTag[i]->setText(QString::number(Data[i], 'f', 2));
    }
    customPlot->replot();

}

具体实现：

获取CPU温度数据：
QT、C++ 获取CPU实时温度，获取监控计算机的温度传感器、风扇速度、电压、负载和时钟速度等数据。

Pyside6-QtCharts+psutil实战-绘制一个CPU监测工具
清欢无别事
06-28 961
今天是实战篇章，我们结合可以快速提升我们开发效率的工具一起开实战一波实时读取系统CPU使用情况的折线图。使用的开发工具Qt Designer来开发UI界面。十分便捷。使用起来也算比较的简单了，虽然也存在不少的BUG。❝对所需要的控件进行拖拽式，就OK。后续会出一个简单的视频录制。❞第二步，就是先将实时读取代码拟定出来。正确运行了，我们在往UI上套。❝使用Pyside6，简单的操作一波。window...
在 QCustomPlot中自定义绘图元素
深之JohnChen的专栏
04-20 534
这是最灵活的方式，适合创建全新的交互式绘图元素。cppQ_OBJECTpublic:// 必须实现的纯虚函数// 自定义属性protected:// 必须实现的纯虚函数private:// 定义项的位置锚点// 自定义属性// 计算箭头路径的辅助函数// 实现return -1;return -1;直接在 QCustomPlot 的绘制事件中添加自定义绘图。cpp。
QT中利用QCustomPlot类画曲线图
01-31
QT中利用QCustomPlot类画曲线图，程序中画了四条曲线，x，y轴自己赋值（若要接收外部数据需要扩展），每条曲线可以设置颜色和粗细以及不同的点标记，每条曲线可以有说明。
QT与QCustomPlot绘图
最新发布
baymax9527的博客
06-06 266
本文探讨了Qt实时绘图的两种实现方案。第一种是纯QML绘图，通过内置定时器获取数据并完成绘图，虽然可行但不推荐，因为QML应专注显示而非数据处理。第二种是C++提供数据接口，QML负责显示和缓存，通过ChartDataProvider类实现数据交互，代码相对简化但仍显复杂。作者指出Qt自带绘图库使用体验欠佳，并预告下期将介绍更简便的QCustomPlot库。两种方案各有利弊，前者适合QML语法练习，后者更适合实际应用开发。
QCustomPlot 使用——绘制折线图
热门推荐
何亮5083的博客
08-04 1万+
//初始化数据 QVector<double> temp; for (int var = 0; var < 25; ++var) { if (rand()%2) { temp.append(var); }else{ temp.append(20); } } QVector<
QCustomplots库的使用，简单画一个动态折线图。
weixin_56211217的博客
12-24 1580
QCustomplots库的使用，简单画一个动态折线图。设置各种参数调整样式
QCustomPlot系列2—绘制折线图(X轴为时间)
zhangzx36的博客
03-20 1755
【代码】QCustomPlot系列2—绘制折线图(X轴为时间)
QT——如何使用QCustomPlot绘制折线图
UNDEFINED_AUBE的博客
08-25 4593
需求：做一个折线图，y轴为温度，x轴为时间，点数据从数据库中获取，鼠标在折线图中悬浮时显示对应点的数据。 我是在Node1_Temperature文件里写折线图。 1、下载安装第三方库QCustomPlot 官方下载地址： https://www.qcustomplot.com/index.php/download 需要注意的地方是2.0.1和1.3.2版本有些内置函数有很大变化，甚至是直接取消了。比如当你x轴显示的字太长放不下，想要旋转字体的时候，1.3.2版本里有一个...
使用QT编写的CPU温度监控，并使用QCustomPlot库绘制温度折线图示例-可执行程序非源码
07-08
Qt Creator 5.13.1 和Mscv2022编译器，以及.net4.7.2库支持，根据第三方库获取的*Window系统的CPU温度数据*，使用**QCustomPlot**库绘制温度折线图，包括实现x轴时间线，折线背景绘制渐变，插值计算温度值，每两秒...
QT使用QCustomPlot绘制曲线并动态显示曲线上的数据
08-27
在本文中，我们将深入探讨如何使用QT框架中的QCustomPlot模块来绘制曲线，并实时动态地显示曲线上的数据。QCustomPlot是一个强大的、可定制的2D绘图库，适用于Qt应用，它允许开发者创建复杂的图表和图形，包括曲线图...
使用QT绘制简单的动态数据折线图
捕鲸叉的专栏
06-12 1532
下面这个示例代码中，定时器每隔一段时间将曲线图中的数据点向右移动 一个单位，同时调整横坐标轴的范围，实现了一次滚动对应移动一个数据点的效果。QLineSeries最多容纳4096+1024个点。两个核心类时QChart和QLineSeries。
Qt基于Qcustomplot画曲线图
03-21
比官网上19个demo，还要多的示例
QCustomPlot-master_QT_qtchart_qt绘制折线图_qt界面_qcustomplot
09-11
qt绘制折线图，趋势图，柱状图等，使用简单，功能强大
QT用Qpainter绘制实时曲线图
07-06
随机生成一组数据，QT用Qpainter绘制实时曲线图最简单的折线图
QCustomPlot示例
03-01
QCustomPlot开发示例，跟股票相关，一个展示的曲线图，别人存下来，以备需要。。。。
QCustomPlotDemo范例
09-05
1.app为可运行包（动态库） 2.Demo为源码 3.演示.gif是演示效果 /*******************************************************************************\ 类的名称： MainWindow 功能描述: 使用QCustomSlot范例 主要函数： init - 初始化 realtimeDataSlot - qt实时刷新 使用方法： 直接作为主界面程序运行 作者： 杨炯 QQ:21497936 邮件: 21497936@qq.com 版本 修改者 日期 备注 V1.0 杨炯 2017年9月5日 基本功能 \*******************************************************************************/ 编译环境 qt5.2 编译器 mingw48
QCustomPlot系列1—绘制折线图(X轴为日期)
zhangzx36的博客
03-19 1399
【代码】QCustomPlot-实现坐标为日期的折线图。
Qt - QCustomPlot折线图
Hsy的博客
04-05 4341
简介 QCustomPlot 是一个Qt三方图表库，在QChart还未免费开放时，应该是一个很受欢迎的三方库。即使现在QChart已经可以免费使用了，有些功能使用QCustomPlot实现，体验也非常棒！下图为QCustomPlot官网的一些示例，非常丰富。 下载 QCustomPlot官网 这里我下载的是最新的版本 QCustomPlot 2.0.1 下载的文件包括： 非常详细的说明文档 官方实例 源码及一份GPL声明 基本概念 QCustomPlot 图表类：用于图表的显示和交互 QCPLaye
[QT QCustomPlot]实时折线图（坐标轴可缩放）
qq_27904009的博客
11-04 2138
QCustomPlot数据折线图实时绘制
qt for python 在Qwiget中实时绘制神经网络训练准确率折线图
05-09
<think>好的，我现在需要帮助用户在Qt for Python中使用QWidget实现实时绘制神经网络训练准确率的折线图。用户的需求很明确，但作为刚接触Qt的新手，可能需要详细的步骤和示例代码。 首先，我得回忆一下PySide2或PySide6中用于绘图的组件。QWidget本身可以用来自定义绘图，通常是通过重写paintEvent方法，使用QPainter来进行绘制。不过，实时更新的话，可能需要定时刷新或者在有新数据时触发重绘。 用户提到的是实时绘制，所以数据应该是在训练过程中不断生成的，比如每个epoch或每个batch后的准确率。这时候需要将数据传递给QWidget，并更新界面。考虑到GUI的线程安全，如果在主线程中进行训练，界面会卡住，所以可能需要使用多线程，将训练放在工作线程中，通过信号槽机制将准确率数据发送到主线程更新图表。 接下来，我需要构建一个示例的结构。可能包括以下几个部分： 1. 创建一个继承自QWidget的自定义绘图部件，负责绘制折线图。 2. 在自定义部件中维护一个存储准确率数据的列表。 3. 重写paintEvent方法，根据数据列表绘制折线图和坐标轴。 4. 创建一个神经网络训练的工作线程，模拟训练过程并生成准确率数据。 5. 使用信号槽将工作线程中的准确率数据传递给主界面，触发界面更新。 关于绘图部分，需要处理坐标系的转换，因为QWidget的坐标原点在左上角，而折线图通常原点在左下角。可能需要根据数据范围动态调整绘图的缩放比例，或者在固定范围内绘制，比如准确率在0到1之间，可以映射到部件的高度。 另外，考虑到实时性，每次添加新数据点时，需要调用update()方法触发重绘。同时，可能需要限制存储的数据点数量，防止内存占用过大，比如只保留最近的100个点。 对于线程部分，使用QThread的子类，在run方法中进行训练循环，每隔一定时间生成一个模拟的准确率值，并通过信号发送出去。主线程中的自定义部件接收到信号后，更新数据列表并重绘。 现在需要检查这些步骤是否正确，是否有遗漏的部分。比如，确保信号槽正确连接，线程的安全退出，以及绘图的高效性，避免界面卡顿。 可能的代码结构： - 自定义的PlotWidget类继承QWidget，包含数据列表和paintEvent的重写。 - 一个Worker类继承QThread，发出准确率更新的信号。 - 主窗口类，包含PlotWidget和启动训练的按钮。 测试时，需要注意PySide2或PySide6的版本，以及是否正确导入相关模块。例如，从PySide2.QtCore导入Signal, Slot, QThread等。 然后，还需要处理窗口的布局，可能将PlotWidget放在主窗口的中央，并添加一些控件来控制训练的启动和停止。 最后，需要验证示例代码是否能够正确运行，并在训练过程中实时更新折线图。如果有问题，可能需要调试信号是否发射，paintEvent是否被正确触发，以及坐标计算是否正确。</think>在PySide中实现训练准确率实时折线图需要结合自定义绘图和异步任务处理，以下是具体实现步骤： ### 一、创建自定义绘图组件 ```python from PySide2.QtWidgets import QWidget, QApplication from PySide2.QtCore import Qt, QPointF, Signal, QThread from PySide2.QtGui import QPainter, QPen, QPolygonF class AccuracyPlot(QWidget): def __init__(self): super().__init__() self.accuracies = [] self.max_points = 50 # 显示最近50个数据点 self.y_range = (0.0, 1.0) # 准确率范围 def add_data(self, value): self.accuracies.append(value) if len(self.accuracies) > self.max_points: self.accuracies.pop(0) self.update() # 触发重绘 def paintEvent(self, event): painter = QPainter(self) painter.setRenderHint(QPainter.Antialiasing) # 绘制坐标系 self.draw_grid(painter) # 绘制折线 if len(self.accuracies) > 1: points = QPolygonF() x_step = self.width() / (self.max_points - 1) for i, val in enumerate(self.accuracies): x = i * x_step y = self.height() * (1 - (val - self.y_range[0])/(self.y_range[1]-self.y_range[0])) points.append(QPointF(x, y)) painter.setPen(QPen(Qt.blue, 2)) painter.drawPolyline(points) def draw_grid(self, painter): painter.setPen(QPen(Qt.lightGray, 1, Qt.DashLine)) # 绘制Y轴刻度 for y in [0.2, 0.5, 0.8]: y_pos = self.height() * (1 - y) painter.drawLine(0, y_pos, self.width(), y_pos) ``` ### 二、实现异步训练线程 ```python class TrainingThread(QThread): update_signal = Signal(float) # 准确率更新信号 def run(self): # 模拟训练过程（替换为真实训练逻辑） for epoch in range(100): accuracy = 0.1 + 0.8 * (epoch/100) # 模拟准确率增长 self.update_signal.emit(accuracy) self.msleep(100) # 模拟训练耗时 ``` ### 三、集成主界面 ```python from PySide2.QtWidgets import QVBoxLayout, QPushButton class MainWindow(QWidget): def __init__(self): super().__init__() self.plot = AccuracyPlot() self.train_btn = QPushButton("开始训练") layout = QVBoxLayout() layout.addWidget(self.plot) layout.addWidget(self.train_btn) self.setLayout(layout) self.thread = TrainingThread() self.train_btn.clicked.connect(self.start_training) self.thread.update_signal.connect(self.plot.add_data) def start_training(self): if not self.thread.isRunning(): self.thread.start() self.train_btn.setText("训练中...") ``` ### 四、启动应用 ```python if __name__ == "__main__": app = QApplication([]) window = MainWindow() window.resize(800, 400) window.show() app.exec_() ``` ### 关键技术点说明： 1. **双缓冲绘图**：通过`QPainter`直接绘制到Widget表面，适合高频更新场景[^1] 2. **坐标系映射**：将[0,1]的准确率映射到窗口高度，使用`QPolygonF`生成平滑折线 3. **线程安全通信**：使用`QThread`+`Signal`实现训练与界面更新的解耦[^2] 4. **动态范围控制**：`max_points`限制显示数据量保证性能
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

得鹿梦鱼、

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值