Question

我能够使用QChart.js来处理饼图而没有问题（极坐标图和甜甜圈图），但是每当我尝试创建折线图（以及雷达图和条形图）时，出现以下错误：

TypeError: Cannot read property 'length' of undefined

饼图的工作代码如下：

Chart {
    id: chart_line
    Layout.fillHeight: true
    Layout.fillWidth: true
    chartType: Charts.ChartType.PIE

    chartData: [
        {value: 15, color: "#6AA84F"},
        {value:  3, color: "#DC3912"},
        {value:  5, color: "#FF9900"}]
}

折线图的损坏代码如下：

Chart {
    id: chart_line
    Layout.fillHeight: true
    Layout.fillWidth: true
    chartType: Charts.ChartType.LINE

    chartData: [
        {labels: ["January","February","March","April","May","June","July"],
         datasets: [{ data: [65,59,90,81,56,55,40]} ] }
    ]
}

我的理解是我没有正确加载chartData。我遇到问题的图表都是在QChartGallery.js的声明中使用列表的图表。我对JavaScript并不是特别熟悉，似乎有关我的语法的某些信息已经关闭，我找不到澄清的文档。

Answer 1

知道了，结果证明这和我认为的解决方案一样愚蠢。对于这些类型的图表，您需要更新chartData上的Component.onCompleted。因此，将来有此问题的任何人的工作示例代码如下：

Chart {
    id: chart_line
    Layout.fillHeight: true
    Layout.fillWidth: true
    chartType: Charts.ChartType.LINE

    Component.onCompleted: {
        chartData = {
            labels: ["January","February","March","April","May","June","July"],
            datasets: [{
                    data: [65,59,90,81,56,55,40]
                }]
        }
    }
}

如何创建QChart.js折线图

1 个答案: