solar-android/Day.qml

import QtQuick 2.0
import QtCharts 2.3

Item {
    property int year;
    property int day;
    property int month;
    property bool isToday: false;

    Component.onCompleted: {
        refresh();
        cache.loaded.connect(refresh)
    }

    Component.onDestruction: {
        cache.loaded.disconnect(refresh);
    }

    function setTimeout(func, interval, ...params) {
        console.log("Setting timeout!", interval)
        return setTimeoutComponent.createObject(parent, { func, interval} );
    }

    function clearTimeout(timerObj) {
        timerObj.stop();
        timerObj.destroy();
    }

    Component {
        id: setTimeoutComponent
        Timer {
            property var func
            running: true
            repeat: false
            onTriggered: {
                func();
                destroy();
            }
        }
    }

    function draw(series, data, shifttime, index, ymax, xmin, xmax){
        const ts = new Date().getTime();
        var xa = xaxis;
        var ya = yaxis;
        if(index === undefined){
            index = 0;
        }
        if(ymax === undefined){
            ymax= 0;
            xmin= new Date("2222-01-01");
            xmax= new Date("1990-01-01");
        }

        if(index >= data.length){
            xa.max = xmax;
            xa.min = xmin;
            ya.max = ymax;
            return;
        }
        var step = 50;
        for(var i=0; i<step; i+=2){
            var coords = data[index+i];
            if(!coords){ break};

            var x = new Date(coords[3].getTime()+shifttime);
            var y = coords[1]
            if(y>ymax){
                ymax = y
            }
            if(x>xmin){
                xmax = x
            }
            if(x<xmin || xmin === 0){
                xmin = x
            }
            series.append(x, y)
        }
        xa.max = xmax;
        xa.min = xmin;
        ya.max = ymax;
        const te = new Date().getTime();
//        console.log("drew", step, "points in ", te-ts, "ms")
        background.setTimeout(function(){draw(series, data, shifttime, index+step,  ymax, xmin, xmax)}, 0)
    }

    function refresh(){
        var ts = new Date().getTime();
//        chart.removeAllSeries();
        const DAY =1000*60*60*24;
        var s = series;
        var ys = yesterdaySeries;
        s.clear();
        ys.clear();
        cache.getForDay(day, month, year, function(data){draw(s, data, 0)})
        if(isToday){
            cache.getForDay(day-1, month, year, function(data){draw(ys, data, DAY)})
        }

//        const xa = xaxis;
//        const ya = yaxis;
//    cache.getForDay(day, month, year)
//                .forEach(function(coords){
//                    var x = coords[3];
//                    var y = coords[1]
//                    if(y>ymax){
//                        ymax = y
//                    }
//                    if(x>xmin){
//                        xmax = x
//                    }
//                    if(x<xmin || xmin === 0){
//                        xmin = x
//                    }
//                    s.append(x, y)
//            })
//        cache.getForDay(day-1, month, year)
//            .forEach(function(coords){
//                var x = coords[3];
//                var y = coords[1]
//                if(y>ymax){
//                    ymax = y
//                }
//                if(x>xmin){
//                    xmax = x
//                }
//                if(x<xmin || xmin === 0){
//                    xmin = x
//                }
//                ys.append(x, y)
//        })
//        xa.max = xmax;
//        xa.min = xmin;
//        ya.max = ymax;
//            var te = new Date().getTime();
//        console.log("rendering graph: ", te-ts)
        }

    ChartView {
        title: year.toString() + "-" + month.toString() + "-" + day.toString()
        anchors.fill: parent
        antialiasing: true
        id: chart

        DateTimeAxis{
            id: xaxis
            format: "hh:mm"
        }

        ValuesAxis {
            id: yaxis
            min: 0
        }


        AreaSeries{
            useOpenGL: true
            name: "wczoraj"
            axisX: xaxis
            axisY: yaxis
            color: "#ccc"
            visible: isToday
            upperSeries: LineSeries {
                id: yesterdaySeries
            }
        }

        AreaSeries {
            useOpenGL: true
            name: isToday? "dzisiaj" : year + "-" + month + "-" + day
            color: "#0074D9"
            borderColor: "#0074D9"
            axisX: xaxis
            axisY: yaxis
            borderWidth: 0
            upperSeries: LineSeries{
                id: series
            }
        }
    }


}