QCustomPlot使用心得三:線樣式,點樣式


轉自: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 說明

ssNone

沒有散點(默認)

ssDot

單像素點(要用能改變大小的圓請使用ssCircle或ssDisc)

ssCross

 

ssPlus

ssCircle

ssDisc

填充的是pen的顏色

ssSquare

ssDiamond

ssStar

ssTriangle

ssTriangleInverted

ssCrossSquare

ssPlusSquare

ssCrossCircle

ssPlusCircle

ssPeace

ssPixmap

通過setPixmap設置的圖像

ssCustom

通過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")));

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM