一、前言

數據轉曲線，這個用的非常多，比如串口或者網絡收到的數據，對特定的字節數據繪制實時的曲線，或者對歷史記錄存儲的數據進行曲線繪制，按照約定的規則，數據轉曲線繪制必須提供規則，沒有規則只能對所有數據繪制，那樣的話肯定很難看，一般下位機傳過來的數據都是有楨頭幀尾校驗碼的，需要剔除無關的數據，一般需要指定哪個字節或者哪幾個字節屬于需要繪制曲線的數據，如果是多個數據，可能還需要合并，比如2個字節合并成一個無符號ushort數據，4個字節合并成一個uint數據，合并轉換的規則還有高低字節位置的區分，有些是高字節在前面，有些是高字節在后面，都必須在規約中體現出來，否則很可能繪制出來的曲線不正確。

開源的QCustomPlot曲線圖表控件，支持的數據量還是挺大的，能到百萬級別，十幾萬幾十萬的數據一次性繪制，都還可以，繪制這塊已經優化到了極致，主要的速度占用應該是計算，繪制倒都是很快的，數據量很大的情況下一般不建議頻繁的繪制，會把UI卡主，任何開發工具和語言，UI都是在主線程，所以繪制這塊一旦太頻繁很可能導致卡主，如果數據量確實很多可以把運算這塊移到其他線程，運算好以后再一次性繪制。對于大數據量的繪制，還有個算法就是過濾掉取平均值數據，因為一個像素上繪制幾十上百個數據點是沒有意義的，都擠在一塊，人眼觀看都是一個問題，所以不如用算法將這些數據點經過一個規則運算合并成一個點數據，可以非常大的減少數據量，等到縮放的時候再自動還原之前的數據。

二、功能特點

采用分層設計，整體總共分三級界面，一級界面是整體布局，二級界面是單個功能模塊，三級界面是單個控件。

子控件包括餅圖、圓環圖、曲線圖、柱狀圖、柱狀分組圖、橫向柱狀圖、橫向柱狀分組圖、合格率控件、百分比控件、進度控件、設備狀態面板、表格數據、地圖控件、視頻控件等。

二級界面可以自由拖動懸浮，支持最小化隱藏、最大化關閉、響應雙擊自定義標題欄。

數據源支持模擬數據（默認）、數據庫采集、串口通信（需定制）、網絡通信（需定制）、網絡請求等，可自由設定每個子界面的采集間隔即數據刷新頻率。

采用純QWidget編寫，親測Qt4.6到Qt6.2任意版本，理論上支持后續其他Qt版本。

超強跨平臺，親測windows、linux、mac、國產uos、國產銀河麒麟kylin等系統，效果完美，同時還支持嵌入式linux比如樹莓派、香橙派、全志、imx6等。

同時集成了自定義控件、qchart餅圖、echart地圖等功能。

內置多套配色風格樣式（紫色、藍色、深藍、黑色），默認紫色，自適應任意分辨率。

可設置系統標題、目標分辨率、布局方案，啟動立即應用。

可設置主背景顏色、面板顏色、十字線游標顏色等各種顏色。

可設置多條曲線不同顏色，沒有設置顏色的情況下內置多套精美顏色隨機應用。

可設置標題欄背景顏色、文字顏色。

可設置曲線圖表背景顏色、文字顏色、網格顏色。

可設置正常顏色、警戒顏色、報警顏色、禁用顏色、百分比進度顏色。

可分別設置各種字體大小，比如全局字體、軟件名稱、標題欄、子標題欄、加粗標簽等。

可設置標題欄高度、表頭高度、行高度。

曲線支持游標、定位線、懸停高亮數據點、懸停顯示值。

柱狀圖支持頂部（可設置頂端、上部、中間、底部）顯示數據，全部自適應計算位置。

支持平滑曲線，內置多種平滑曲線算法，還支持面積圖平滑。

面積圖填充顏色可選多種規則比如單色透明度填充、透明度漸變填充等。

數據庫支持sqlite、mysql、postgresql、oracle、國產人大金倉等數據庫。

主界面直接鼠標右鍵切換布局、配色方案、關閉開啟某個二級窗體。

自動記憶所有子窗口的大小和位置，下次啟動立即應用。

動態加載布局方案菜單，可以動態新建布局、恢復布局、保存布局、另存布局等，用戶可以制造任意布局。

二級窗體，雙擊從主窗體分離出來浮動，可以自由調整大小。再次雙擊標題欄最大化，再次雙擊還原。

子模塊也可以全屏顯示作為一個大屏，這樣就可以一個大屏拓展出多個子大屏，放大查看子模塊的數據詳情，適用多屏展示。

每個模塊都可以自定義采集速度，如果是數據庫采集會自動排隊處理，后期還可以拓展每個子模塊都獨立的數據庫采集。

提供系統設置模塊進行整體的配置參數設置，效果立即應用。

提供精美炫酷的大屏地圖模塊，包括靜態圖片、閃爍效果、遷徙效果、世界地圖、區域地圖等，可指定點的經緯度坐標，識別單擊響應，可以做地圖跳轉等，每個點都可以不同的顏色和提示信息。

除了提供大屏系統外，還將每個模塊都做了獨立的模塊示例界面，每個模塊都可以獨立學習使用，里面用到的控件也單獨做了控件示例界面，方便學習每個控件如何使用。

非常詳細的開發和使用手冊，其中包括數據庫說明、模塊對照圖、控件對照圖、項目結構、代碼說明（精確到每個類）、演示demo、使用方法等。

三、體驗地址

體驗地址：https://pan.baidu.com/s/1d7TH_GEYl5nOecuNlWJJ7g 提取碼：01jf 文件名：bin_bigscreen.zip。

國內站點：https://gitee.com/feiyangqingyun

國際站點：https://github.com/feiyangqingyun

個人主頁：https://blog.csdn.net/feiyangqingyun

知乎主頁：https://www.zhihu.com/people/feiyangqingyun/

在線文檔：https://feiyangqingyun.gitee.io/qwidgetdemo/bigscreen/

四、效果圖

五、核心代碼

#include "frmplotdata.h" #include "ui_frmplotdata.h" #include "quihelper.h"frmPlotData::frmPlotData(QWidget *parent) : QWidget(parent), ui(new Ui::frmPlotData) {ui->setupUi(this);this->initForm();this->loadPlot(); }frmPlotData::~frmPlotData() {delete ui; }void frmPlotData::initForm() {//添加畫布ui->customPlot->addGraph(1);//設置拖動縮放模式ui->customPlot->setInteractions(3);//設置邊距ui->customPlot->setPadding(15);//設置數據點的大小ui->customPlot->setPointSize(0);//設置文本顏色ui->customPlot->setTextColor(Qt::white);//設置XY軸范圍值ui->customPlot->setRangeX(0, 1000, 15);ui->customPlot->setRangeY(0, 1000, 15);//綁定雙擊重新加載數據connect(ui->customPlot->getPlot(), SIGNAL(mouseDoubleClick(QMouseEvent *)), this, SLOT(loadPlot())); }void frmPlotData::loadPlot() {//從文本文件讀取數據 具體格式可以自行打開文件查看QString fileName = QString(":/image/data%1.txt").arg(rand() % 3);QFile file(fileName);if (file.open(QFile::ReadOnly | QIODevice::Text)) {QString value = file.readAll();file.close();vdouble keys, values;QStringList list = value.split(" ");int len = list.length();//如果不是2的倍數則長度要減去1if (len % 2 != 0) {len = (len - 1);}for (int i = 0; i < len / 2; i++) {keys.append(i);}//每兩個16進制數字組合成一個數字for (int i = 0; i < len; i = i + 2) {qint16 value = CustomPlotHelper::strHexToShort(QString("%1%2").arg(list.at(i)).arg(list.at(i + 1)));values.append(value);}LineData data;data.index = 0;data.name = "角度值";data.key = keys;data.value = values;//設置線條顏色,可以指定顏色也可以隨機顏色data.lineColor = CustomPlotHelper::getRandColor();data.scatterShape = 0;data.fillColor = 1;data.autoScale = true;ui->customPlot->setDataLine(data);ui->customPlot->replot();} }

總結

以上是生活随笔為你收集整理的Qt编写可视化大屏电子看板系统21-数据转曲线的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。