I am using QML bindings for Charts.js, which is based on HTML5 javascript library using the canvas element.
I am trying to use a LinePlot and add data to it during run time. But it gets really slow just a few seconds after i start it.
I am not sure if my code is the reason for the slowdown or the library. Is there anything I can optimize to make my plot behave more smoothly?
I have made the RealtimePlot component below:
import QtQuick 2.0
import jbQuick.Charts 1.0
Rectangle {
property var label: []
property var values: []
property int length: 0
Timer {
id: dataTimer
interval: 100
repeat: true
onTriggered: addData([5, 10])
}
Timer {
id: plotUpdateTimer
interval: 100
repeat: true
running: true
onTriggered: {
chart.repaint()
}
}
Chart {
id: chart
height: parent.height
width: parent.width
chartAnimated: false
//chartAnimationEasing: Easing.InOutElastic
//chartAnimationDuration: 2
chartType: Charts.ChartType.LINE
Component.onCompleted: {
//Start simulated data timer.
dataTimer.start()
//Set data visual properties and data/label variables.
chartData = {
labels: label,
datasets: [
{
label: "Dataset",
fillColor: "rgba(220,220,220,0.2)",
strokeColor: "rgba(220,220,220,1)",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "#fff",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: values
},
]
};
}
}
function addData(data)
{
//Add new labels/values.
for (var i = length; i < (length + data.length); i++)
{
label.push(i)
values.push(data[i - length])
}
//Update total labels/values length.
length += data.length
}
}
Aucun commentaire:
Enregistrer un commentaire