QML简易饼状图的绘制

序言

因为QML饼状图几乎搜不到什么资料，所以我来补一下QML的低端场面了。

环境

Qt5.12

一、效果图

二、源码

import QtQuick 2.0
import QtCharts 2.3

ChartView {
    anchors.fill: parent
    title: qsTr( "饼状图" )
    titleColor: "black"
    titleFont.bold: true
    legend.alignment: Qt.AlignBottom		//图例的位置，就是饼状图下方的那五个词的位置
    antialiasing: true						//抗锯齿

    PieSeries {
        id: pieSeries
        endAngle: 0

		//value的值并不是百分比，而是你任意指定的值，指定值 / 所有值 = 百分比
        PieSlice {  label: "富士康订单"; value: 32 }
        PieSlice {  label: "大华订单"  ; value: 48 }
        PieSlice {  label: "海康订单"  ; value: 72 }
        PieSlice {  label: "慧视订单"  ; value: 61 }
        PieSlice {  label: "其他订单"  ; value: 40 }
    }
}

源码挺简单的，我就不多介绍了，会QML的自然也会这个，不会的先学会QML吧，如果实在没时间先学QML的话，你就翻译一下单词意思，对照下图的数据，基本也能弄得出来。

注意

还有一件事：如果发现你弄的饼状图数据和显示出来的对不上，那就qmake一下，就会好的。

这是因为显示的是默认的饼状图，QML的数据没连起来。

还有一件事：你按照源码弄出来的饼状图和我的不太一样是正常的，因为我的是多做了一点点的功能增加。

比如说PieSlice这个代表扇形图的，是有一些其他属性可以更改值的，去Qt助手看看文档吧。

PieSlice {  
	label: "富士康订单"
	value: 32
	exploded: true
	labelPosition: PieSlice.LabelOutside
    labelVisible: true
}