美文网首页
10--Qt的chartView的柱状图属性说明以及y轴正常显示

10--Qt的chartView的柱状图属性说明以及y轴正常显示

作者: lvyweb | 来源:发表于2018-09-14 09:00 被阅读27次

标签(空格分隔): Qt


使用chartView的柱状图的属性说明

demo

import QtQuick 2.0
import QtCharts 2.2
import QtQuick.Controls 1.2
Rectangle {
    anchors.centerIn: parent;
    width: 600;
    height: 400;
    property var xdata: ["1","2","3","4","5","6","7"];
    property var ydata: ["1","100","200","300","400","500","600"];
    ChartView {
        id:tetView;
        title: "Spline";
        anchors.left: parent.left;
        width: 500;
        height: 400;
        antialiasing: true;

        BarSeries {
            id: barGraph;
            labelsVisible: true;//柱状图显示每个数据
            labelsPosition: AbstractBarSeries.LabelsInsideEnd;
            opacity:0.3;
             axisX: BarCategoryAxis {
                 categories:xdata;
                 labelsColor: "green";//x轴字体颜色
             }
             axisY: ValueAxis {
                 id:axisY1;
                 labelsColor: "red";//y轴字体颜色
             }

//             BarSet {
//                 label: "Bob";
//                 values: ydata0;//y刻度线的值
//             }
              BarSet {
                  label: "test";
                  values: ydata;
                  color: "green";
              }
             Component.onCompleted: {
                 console.log("柱状图加载完成");
             }
        }
        Button {
            id: changeBtn;
            width: 80;
            height: 30;
            anchors.left: parent.right;
            text: "换数据";
            onClicked: {
                barGraph.clear();
                xdata =  ["2011","2012","2013","2014","2015","2016","2017"];
                ydata =  ["1","2","3","4","5","6","7"];
                barGraph.axisX.categories=xdata;//x轴的值
//                 barGraph.insert(0, "label",ydata) //y轴数据
                barGraph.append("21",ydata);//y轴数据
                console.log("barGraph==="+JSON.stringify(barGraph));
                axisY1.max = Math.max.apply(null, ydata);//最大值
                axisY1.min =Math.min.apply(null, ydata);//最小值
            }
        }
    }

}


柱状图动态加载图

相关文章

网友评论

      本文标题:10--Qt的chartView的柱状图属性说明以及y轴正常显示

      本文链接:https://www.haomeiwen.com/subject/japngftx.html