轉自:https://blog.csdn.net/yxy244/article/details/100033549
一、線寬、樣式、顏色

通過畫筆QPen設置線的線寬、樣式和顏色,線樣式Qt::PenStyle有幾個枚舉值,實線虛線等。
代碼例子:
1 QPen pen; 2 pen.setWidth(3);//線寬 3 // 添加Graph,1條曲線使用一個Graph 4 customPlot->addGraph(); 5 pen.setStyle(Qt::PenStyle::DashLine);//虛線 6 pen.setColor(Qt::yellow);//黃色 7 customPlot->graph(0)->setPen(pen); //
二、填充色
畫刷QBrush設置曲線和0軸填充色圍成區域的顏色,可以看到重疊部分顏色是疊加的

代碼例子:
1 customPlot->addGraph(); 2 customPlot->graph(0)->setBrush(QBrush(QColor(0,0,255,150))); //藍色,透明度150 3 customPlot->addGraph(); 4 customPlot->graph(1)->setBrush(QBrush(QColor(255,0,0,150))); //紅色,透明度150
三、數據點連接方式
先看一下官網的圖例https://www.qcustomplot.com/index.php/demos/linestyledemo

調用setLineStyle設置數據點連接方式,QCPGraph::LineStyle有幾個枚舉值
| QCPGraph::LineStyle |
說明 |
| lsNone |
無連接線 |
| lsLine |
直線連接(默認) |
| lsStepLeft |
階梯線,高度和左邊數據點對齊 |
| lsStepRight |
階梯線,高度和右邊數據點對齊 |
| lsStepCenter |
階梯線,階梯在兩個數據中間 |
| lsImpulse |
脈沖線 |
代碼例子:
customPlot->graph(0)->setLineStyle((QCPGraph::LineStyle::lsStepLeft));//階梯線,左對齊
四、散點圖,點樣式
散點就是在圖上用某個圖形標出數據點,默認情況下是不顯示數據點圖形的,需要通過調用setScatterStyle(const QCPScatterStyle & style)來設置散點樣式,才會顯示點圖案,傳遞的參數是一個QCPScatterStyle對象,如果想只顯示數據點而不顯示線,可以設置線樣式為lsNone



只顯示散點的方法:
1 //不顯示連線 2 customPlot->graph(0)->setLineStyle(QCPGraph::LineStyle::lsNone); 3 //數據點+號 4 customPlot->graph(0)->setScatterStyle(QCPScatterStyle(QCPScatterStyle::ScatterShape::ssPlus,5));

調用setScatterSkip(int)設置繪制一個點后跳過的點數,可以讓曲線變得稀疏
1 //繪制一個點后跳過2個點 2 3 customPlot->graph(0)->setScatterSkip(2);
(1)QCPScatterStyle::ScatterShape枚舉樣式
先看一下官網的圖例https://www.qcustomplot.com/index.php/demos/scatterstyledemo

QCPScatterStyle::ScatterShape的樣式包含的很多基本形狀,一般足夠使用了
| QCPScatterStyle::ScatterShape | 說明 |
| 沒有散點(默認) | |
| 單像素點(要用能改變大小的圓請使用ssCircle或ssDisc) | |
|
|
| 通過setPixmap設置的圖像 | |
| 通過setCustomPath設置的路徑 |
(2)ssCustom自定義散點
注意到官網圖例的最后一條曲線的散點圖案是自定義的三葉草的形狀,其實原理就是通過QPainterPath來實現的

通過添加三條貝塞爾曲線組圖案,放大看:

1 QPainterPath customScatterPath; 2 //添加3條貝塞爾曲線,形成葉子形狀 3 for (int i=0; i<3; ++i) 4 customScatterPath.cubicTo(qCos(2*M_PI*i/3.0)*9, qSin(2*M_PI*i/3.0)*9, qCos(2*M_PI*(i+0.9)/3.0)*9, qSin(2*M_PI*(i+0.9)/3.0)*9, 0, 0); 5 //設定散點圖案為自定義的路徑 6 customPlot->graph()->setScatterStyle(QCPScatterStyle(customScatterPath, QPen(Qt::black, 0), QColor(40, 70, 255, 50), 10));
貝塞爾曲線挺復雜的,可以試着畫個簡單的五角星

1 QVector<double> x1(1),x2(4),y1(1),y2(4); 2 //數據點(五角星位置) 3 x1[0]=0.5;y1[0]=0.75; 4 x2[0]=1;x2[1]=1; 5 x2[2]=1.2;x2[3]=1.2; 6 y2[0]=0.9;y2[1]=0.6;y2[2]=0.8;y2[3]=0.7; 7 // 添加兩個graph,一個顯示大五星,另一個顯示小五星 8 customPlot->addGraph(); 9 customPlot->graph(0)->setData(x1, y1); 10 customPlot->addGraph(); 11 customPlot->graph(1)->setData(x2, y2); 12 //不顯示連線 13 customPlot->graph(0)->setLineStyle(QCPGraph::LineStyle::lsNone); 14 customPlot->graph(1)->setLineStyle(QCPGraph::LineStyle::lsNone); 15 //五角星路徑 16 QPainterPath customScatterPath; 17 customScatterPath.moveTo(qCos(18/180.0*M_PI)*2, -qSin(18/180.0*M_PI)*2); 18 customScatterPath.lineTo(qCos(162/180.0*M_PI)*2,-qSin(162/180.0*M_PI)*2); 19 customScatterPath.lineTo(qCos(306/180.0*M_PI)*2,-qSin(306/180.0*M_PI)*2); 20 customScatterPath.lineTo(qCos(90/180.0*M_PI)*2, -qSin(90/180.0*M_PI)*2); 21 customScatterPath.lineTo(qCos(234/180.0*M_PI)*2,-qSin(234/180.0*M_PI)*2); 22 customScatterPath.closeSubpath();//閉合路徑 23 //設置散點樣式為自定義的路徑 24 customPlot->graph(0)->setScatterStyle(QCPScatterStyle(customScatterPath, QPen(Qt::black, 0), Qt::yellow, 100)); 25 customPlot->graph(1)->setScatterStyle(QCPScatterStyle(customScatterPath, QPen(Qt::black, 0), Qt::yellow, 40)); 26 //x軸范圍 27 customPlot->xAxis->setRange(0,3); 28 //y軸范圍 29 customPlot->yAxis->setRange(0,1); 30 customPlot->replot();
(3)ssPixmap圖像
要顯示好看的圖案,用自定義路徑的方式很復雜,實際上直接使用圖像更方便

圖像添加到資源文件里

QCPScatterStyle設置為圖像就行了
1 //數據點顯示圖像 2 customPlot->graph(0)->setScatterStyle(QCPScatterStyle(QPixmap(":image/huaji.png")));
