在QML中绘制LineSeries图表

时间:2017-08-02 09:57:18

标签: javascript qt charts qml

我是Qt / QML的新手,我需要在X轴上绘制一个带有格式时间的图表(例如:00:05(格式为hh:mm))。在Qt文档中我找到了一个例子:

    ChartView {
    title: "Accurate Historical Data"
    anchors.fill: parent
    legend.visible: false
    antialiasing: true

    LineSeries {
        axisX: DateTimeAxis {
            format: "yyyy MMM"
            tickCount: 5
        }
        axisY: ValueAxis {
            min: 0
            max: 150
        }

        // Please note that month in JavaScript months are zero based, so 2 means March
        XYPoint { x: toMsecsSinceEpoch(new Date(1950, 2, 15)); y: 5 }
        XYPoint { x: toMsecsSinceEpoch(new Date(1970, 0, 1)); y: 50 }
        XYPoint { x: toMsecsSinceEpoch(new Date(1987, 12, 31)); y: 102 }
        XYPoint { x: toMsecsSinceEpoch(new Date(1998, 7, 1)); y: 100 }
        XYPoint { x: toMsecsSinceEpoch(new Date(2012, 8, 2)); y: 110 }
    }
}

// DateTimeAxis is based on QDateTimes so we must convert our JavaScript dates to
// milliseconds since epoch to make them match the DateTimeAxis values
function toMsecsSinceEpoch(date) {
    var msecs = date.getTime();
    return msecs;
}

如何用时间而不是日期设置X轴的值? 非常感谢您的帮助

1 个答案:

答案 0 :(得分:1)

您可以在Date构造函数中指定(更多)确切时间。

XYPoint{ x: toMsSinceEpoch(new Date(2017, 9, 27, 15, 29, 21)), y: 5 }

https://developer.mozilla.org/nl/docs/Web/JavaScript/Reference/Global_Objects/Date

然后您可以将X轴格式设置为显示小时和秒:

DateTimeAxis {
    ....
    format: "hh:mm"
}