QT -- QChart畫餅狀圖

Qt 由許多模塊組成，如 Core、GUI、Widgets、WebEngine、QML等。其中的Charts 模塊，包含了一系列有關圖表的組件，使用的是 Qt 的 Graphics View 框架，該模塊以前只在商業版中才有。

從 Qt 5.7 開始，該模塊通過 GPLv3 許可，已經對 Qt 開源版開放使用。

1  餅圖 (pie chart)

1.1  Charts 模塊

  .pro 中添加如下語句：

QT  +=charts

頭文件和命名空間

#include <QtCharts>
using namespace QtCharts;

1.2  代碼示例

1） 頭文件

  Qt  中實現餅圖的例程，主要使用了 QPieSeries + QPieSlice + QChart + QChartView 這四個類，如下所示： #1 ~ #5 聲明了頭文件

#include <QtWidgets/QApplication>

#include <QtWidgets/QMainWindow>

#include <QtCharts/QChartView>

#include <QtCharts/QPieSeries>

#include <QtCharts/QPieSlice>

using namespace QtCharts;

//實際上也可用兩個頭文件代替：

#include <QtWidgets>

#include <QtCharts>

2） QPieSeries 類

#13 ~ #16 新建 QPieSeries 類指針，並將其分為三份，各占10%，20% 和 70%；#17 設置標簽屬性，使其可見；

 int main(intargc, char *argv[])
{
    QApplication a(argc, argv);

    QPieSeries *series = new QPieSeries();

    series->append("10%", 1);  //設置百分百

    series->append("20%", 2);

    series->append("70%", 7);

    series->setLabelsVisible();  //設置標簽可見
}

3） QPieSlice 類

 #19 ~ #24 使用 QPieSlice 設置每一份的顏色，分別為：紅、綠、藍；

QPieSlice *slice_red =series->slices().at(0);

QPieSlice *slice_green =series->slices().at(1);

QPieSlice *slice_blue =series->slices().at(2);

slice_red->setColor(QColor(255,0,0,255));  //設置顏色

slice_green->setColor(QColor(0,255,0,255));

slice_blue->setColor(QColor(0,0,255,255));

4） QChart  和 QChartView

 #26 ~ #29 新建 QChart 類指針，並將 series 添加到 chart 中，然后設置標題和隱藏圖例；

  #31 ~ #32 新建 QChartView 類指針，然后將 chart 添加到 chartview 中，設置其渲染屬性為 “抗混疊” (QPainter::Antialiasing)；

  #34 ~ #37 新建 QMainWindow 類對象，並將 chartview 置於中間 (setCentralWidget() 函數)，然后重設其大小，並 show() 出來。

//新建QChart，將series添加到chart中

QChart *chart = new QChart();

chart->addSeries(series);

chart->setTitle("PieChart Example");  //設置標題

chart->legend()->hide();  //隱藏圖例


//新建QChartView，將chart添加到chartview里

QChartView *chartview = new QChartView(chart);

chartview->setRenderHint(QPainter::Antialiasing); //設置渲染屬性


//新建QMainWindow，將chartview置於中間

QMainWindow window;

window.setCentralWidget(chartview);

window.resize(480, 360);

window.show();


returna.exec();

}

輸出如下：

  

 

2  圓環圖 (donut chart)

#5 用的是 Qt 中的命名空間聲明，等效於 using namespace QtCharts

  圓環圖中間有空，對應 #11，設置了中間孔的尺寸大小；另外，#21設置了圓環圖的顯示主題，#22 設置的是圖例的字體；其它代碼，餅圖的大同小異。

#include <QtWidgets>

#include <QtCharts> 

QT_CHARTS_USE_NAMESPACE           //等效於using namespace QtCharts
 
int main(intargc, char *argv[])
{
    QApplication a(argc, argv);

    QPieSeries *series = new QPieSeries();

     series->setHoleSize(0.35);     //設置圓環中間孔的大小

     series->append("Protein 4.2%", 4.2);

     series->append("Carbs 56.4%", 56.4);

     series->append("Other 23.8%", 23.8);


     QChartView *chartView = new QChartView();

    chartView->setRenderHint(QPainter::Antialiasing);

    chartView->chart()->setTitle("DonutChart Example");

    chartView->chart()->addSeries(series);

    chartView->chart()->legend()->setAlignment(Qt::AlignBottom);

     chartView->chart()->setTheme(QChart::ChartThemeBlueCerulean);   //設置圓環圖的顯示主題

    chartView->chart()->legend()->setFont(QFont("Arial",7));        //設置圖例的字體


    QMainWindow window;

    window.setCentralWidget(chartView);

    window.resize(400, 300);

    window.show();

    returna.exec();

}

輸出界面如下：