Pi2-FGABreja/FGABrejaWeb

{% load i18n %}

<script>
    $(function () {
        $(document).ready(function () {
            Highcharts.setOptions({
                global: {
                    useUTC: false
                }
            });

            $('#realtime-chart').highcharts({
                chart: {
                    type: 'spline',
                    animation: Highcharts.svg, // don't animate in old IE
                    marginRight: 10,
                    events: {
                        load: function () {

                            // set up the updating of the chart each second
                            var series = this.series[0];
                            var maxSamples = 15;
                            var count = 0;
                            $.get("{% url 'temperature_average' %}", function(data) {
                                x = (new Date()).getTime()
                                y = Number(data['average'])
                                series.addPoint([x, y], true, (++count>=maxSamples))
                                console.log(x, y)

                            })
                            setInterval(function () {
                                $.get("{% url 'temperature_average' %}", function(data) {
                                    x = (new Date()).getTime()
                                    y = Number(data['average'])
                                    series.addPoint([x, y], true, (++count>=maxSamples))
                                    console.log(x, y)

                                })
                            }, 5000);
                        }
                    }
                },
                title: false,
                xAxis: {
                    type: 'datetime',
                    tickPixelInterval: 50
                },
                yAxis: {
                    title: {
                        text: 'Temperature'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                colors: ['#d32f2f'],
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.series.name + '</b><br/>' +
                            Highcharts.dateFormat('%d/%m/%Y %H:%M:%S', this.x) + '<br/><br/>' +
                            Highcharts.numberFormat(this.y, 2) + ' ºC';
                    }
                },
                legend: {
                    enabled: false
                },
                exporting: {
                    enabled: false
                },
                series: [{
                    name: 'Temperature',
                    data: []
                }]
            });
        });
    });
</script>