要從Qt Creator運行示例，請打開“歡迎”模式，然后從“example”中選擇example。有關更多信息，請訪問構建和運行示例。

創建餅狀圖分解圖

讓我們從為圖表定義一些數據開始。

// Graph is based on data of 'Total consumption of energy increased by 10 per cent in 2010'
// Statistics Finland, 13 December 2011
// //www.stat.fi/til/ekul/2010/ekul_2010_2011-12-13_tie_001_en.html

QPieSeries *series1 = new QPieSeries();
series1->setName("Fossil fuels");
series1->append("Oil", 353295);
series1->append("Coal", 188500);
series1->append("Natural gas", 148680);
series1->append("Peat", 94545);

QPieSeries *series2 = new QPieSeries();
series2->setName("Renewables");
series2->append("Wood fuels", 319663);
series2->append("Hydro power", 45875);
series2->append("Wind power", 1060);

QPieSeries *series3 = new QPieSeries();
series3->setName("Others");
series3->append("Nuclear energy", 238789);
series3->append("Import energy", 37802);
series3->append("Other", 32441);

然后，我們創建一個圖表，在其中添加數據。請注意，這是我們自己從QChart衍生的圖表。

DonutBreakdownChart *donutBreakdown = new DonutBreakdownChart();
donutBreakdown->setAnimationOptions(QChart::AllAnimations);
donutBreakdown->setTitle(("Total consumption of energy in Finland 2010");
donutBreakdown->legend()()->setAlignment((Qt::AlignRight););
donutBreakdown->addBreakdownSeries(series1(series1, Qt::red););
donutBreakdown->addBreakdownSeries(series2(series2, Qt::darkGreen););
donutBreakdown->addBreakdownSeries(series3(series3, Qt::darkBlue););

我們自己的圖表以這樣的方式工作：我們在構造函數中創建一個主系列，然后創建一個主系列，該主系列匯總了細分系列提供的數據。這是中心的餅圖。

DonutBreakdownChart::DonutBreakdownChart((QGraphicsItem *parent, Qt::WindowFlags wFlags) wFlags)
    : : QChart(QChart::ChartTypeCartesian, parent, wFlags))
{{
    // create the series for main center pie
    m_mainSeries = new QPieSeries();
    m_mainSeries->setPieSize((0.7);
    
    QChart::addSeries(m_mainSeries);(m_mainSeries);
}}

添加故障序列后，數據將用于在主序列中創建一個切片，而故障序列本身將用于創建定位的甜甜圈的一部分，以使其與主序列中的相應切片對齊。

void DonutBreakdownChartDonutBreakdownChart::addBreakdownSeries((QPieSeries *breakdownSeries, QColor color))
{{
    QFont font(("Arial", 8);

    // add breakdown series as a slice to center pie
    MainSlice MainSlice *mainSlice = new MainSlice(breakdownSeries);MainSlice(breakdownSeries);
    mainSlice->setName(breakdownSeries(breakdownSeries->name());());
    mainSlice->setValue(breakdownSeries(breakdownSeries->sum());());
    m_mainSeries->append(mainSlice);(mainSlice);

    // customize the slice
    mainSlice->setBrush(color);(color);
    mainSlice->setLabelVisible();();
    mainSlice->setLabelColor((Qt::white););
    mainSlice->setLabelPosition((QPieSlice::LabelInsideHorizontal););
    mainSlice->setLabelFont(font);(font);

    // position and customize the breakdown series
    breakdownSeries->setPieSize((0.8);
    breakdownSeries->setHoleSize((0.7);
    breakdownSeries->setLabelsVisible();
    ();
    const auto slices = breakdownSeries->slices();
    ();
    for ((QPieSlice *slice : slices) {: slices) {
        color = color.lighter((115);
        slice->setBrush(color);(color);
        slice->setLabelFont(font);(font);
    }}

    // add the series to the chart
    QChart::addSeries(breakdownSeries);(breakdownSeries);

    // recalculate breakdown donut segments
    recalculateAngles();();

    // update customize legend markers
    updateLegendMarkers();();
}}

這是如何計算餅圖段的起始角度和終止角度的方法。

void DonutBreakdownChartDonutBreakdownChart::recalculateAngles()()
{{
    qreal angle = 0;
    
    const auto slices = m_mainSeries->slices();
    ();
    for ((QPieSlice *slice : slices) {
        : slices) {
        QPieSeries *breakdownSeries = qobject_cast<MainSlice  *>(slice)slice)->breakdownSeries();();
        breakdownSeries->setPieStartAngle(angle);(angle);
        angle += slice->percentage() () * 360.0;  // full pie is 360.0
        breakdownSeries->setPieEndAngle(angle);(angle);
    }}
}}

圖例標記是自定義的，以顯示細分百分比。主級別切片的標記被隱藏。

void DonutBreakdownChartDonutBreakdownChart::updateLegendMarkers()()
{{
    // go through all markers
    const auto allseries = series();
    ();
    for ((QAbstractSeries *series : allseries) {
        : allseries) {
        const auto markers = legend()()->markers(series);
        (series);
        for ((QLegendMarker *marker : markers) {
            : markers) {
            QPieLegendMarker *pieMarker = qobject_cast<QPieLegendMarker *>(marker);
            marker);
            if (series (series == m_mainSeries) {
                ) {
                // hide markers from main series
                pieMarker->setVisible((false);
            } } else {
                {
                // modify markers from breakdown series
                pieMarker->setLabel((QString("%1 %2%")
                                    
                                    .arg(pieMarker(pieMarker->slice()()->label())
                                    ())
                                    .arg(pieMarker(pieMarker->slice()()->percentage() () * 100, 0, 'f', 2));
                pieMarker->setFont((QFont("Arial", 8));
            }}
        }}
    }}
}}

相反，主級別切片會在標簽上顯示百分比。

MainSlice::MainSlice((QPieSeries *breakdownSeries, QObject *parent))
    : : QPieSlice(parent)parent),
      m_breakdownSeries(breakdownSeries)(breakdownSeries)
{{
    connect((this, &MainSlice::percentageChanged, this, &MainSlice::updateLabel););
}}
void MainSliceMainSlice::updateLabel()()
{{
    this->setLabel((QString("%1 %2%").arg(m_name)(m_name).arg(percentage() (percentage() * 100, 0, 'f', 2));
}}

現在我們已經定義了圖表，我們終于可以創建一個QChartView并顯示該圖表。

QMainWindow window;
;
QChartView *chartView = new QChartView(donutBreakdown);donutBreakdown);
chartView->setRenderHint((QPainter::Antialiasing););
window.setCentralWidget(chartView);(chartView);
window.resize((800, 500);
window.show();();

• QtitanRibbon| 下載試用: 遵循Microsoft Ribbon UI Paradigm for Qt技術的Ribbon UI組件，致力于為Windows、Linux和Mac OS X提供功能完整的Ribbon組件。
• QtitanChart | 下載試用 :是一個C ++庫，代表一組控件，這些控件使您可以快速地為應用程序提供漂亮而豐富的圖表。并且支持所有主要的桌面。
• QtitanNavigation | 下載試用 :模擬Microsoft Dynamics CRM-2016/Office 365導航界面和一組控件改善Qt.C ++應用程序用戶體驗的QtitanNavigation組件。