QML 绘制BarSeries(柱状图)

最新推荐文章于 2024-05-15 08:51:17 发布

士毅

最新推荐文章于 2024-05-15 08:51:17 发布

阅读量479

点赞数 7

分类专栏： QML 基础文章标签： qml

本文链接：https://blog.csdn.net/liushiyi3083862599/article/details/136923580

版权

QML 基础专栏收录该内容

17 篇文章 0 订阅

订阅专栏

一.BarSeries(柱状图)介绍

在QML中绘制柱状图，通常需要使用QtCharts模块中的BarSeries和BarSet类来创建数据系列，并使用QChartView作为图表的视图。

二.BarSeries(柱状图)代码示例

import QtQuick 2.12
import QtQuick.Window 2.12
import QtCharts 2.3

Window
{
    visible: true
    width: 640
    height: 480
    title: qsTr("Test Example")
    
    ChartView
    {
        anchors.fill: parent
        title: qsTr( "柱状图" )
        titleColor: "black"
        titleFont.bold: true
        legend.alignment: Qt.AlignBottom
        antialiasing: true   //反锯齿
        backgroundColor: "transparent"
        animationOptions: ChartView.NoAnimation

        //设置坐标轴
        BarCategoryAxis
        {
            id: axisX
            categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"]
            labelsVisible: true
            titleText : "月份"
        }

        ValueAxis
        {
            id: axisY
            min: 0
            max: 10
            labelsColor:"#111111"
            tickCount: 5
            labelsVisible: true
            titleText : "差值"
        }

        // 柱形系列
        BarSeries
        {
            id: barSeries
            barWidth:0.4
            axisX: axisX
            axisY: axisY
            labelsPosition: AbstractBarSeries.LabelsInsideEnd//柱状条形图里面的数字位置
            labelsVisible: true		//柱状条形图里数字值是否显示，默认不显示
            BarSet {
                label: "目前"
                color: "orange"
                values: [ 4, 4, 7, 7, 5 ]
            }
            BarSet {
                label: "目标"
                color: "green"
                values: [ 5, 5, 7, 8, 10]
            }
        }
    }

}

运行结果：