diegotam85
Posts: 1
Joined: Tue Dec 07, 2021 5:22 pm

Line chart displaing incorrect line

Hello, I just started using highcharts and something is wrong in my code.
The data are in the correct time order but the line should conncect all the point from the older to the newer, but it's doing this funny thingh.
Anyone knows why?

Image

Code: Select all

 
    Highcharts.chart('container', {
    chart: {
        type: 'line',
        zoomType: 'x',
        panning: true,
        panKey: 'shift',
        marginBottom: 100,
        marginTop: 100,
        
    },
    credits: {
        enabled: false
    },
       
    title: {
        text: 'Storico temperatura del giorno <?php echo $chart_data_invert; ?>'
    },
    subtitle: {
        text: document.ontouchstart === undefined ?
        'Tieni premuto il tasto desto e trascina per ingrandire, usa il tasto Shift per scorrere' : 'Usa due dita sullo schermo per ingrandire'
    },
    caption: {
       
    },
    
    xAxis: {
        type: 'datetime',

        labels: {
            format: '{value:%k:%M:%S}'
        },
       
    },
    yAxis: {
        title: {
        text: 'Temperatura'
        },
        labels: {
            format: '{value} \xB0C'
        },
    },
    legend: {
        enabled: false
    },
    plotOptions: {
        area: {
        fillColor: {
            linearGradient: {
            x1: 0,
            y1: 0,
            x2: 0,
            y2: 1
            },
            stops: [
            [0, Highcharts.getOptions().colors[0]],
            [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
            ]
        },
        marker: {
            radius: 1
        },
        lineWidth: 1,
        states: {
            hover: {
            lineWidth: 1
            }
        },
        threshold: null
        
        }
    },

    series: [{
        
        name: 'Temp Celsius',
        negativeColor: 'blue',
        data: [<?php 
        foreach ($result as $row) { 
            echo "[" . (strtotime($row["reading_time"])+3600)*1000 . ", " . $row["value1"] . "],";
        }?>],
        
    }]
    });
;

mateusz.b
Posts: 2006
Joined: Tue Jul 13, 2021 11:34 am

Re: Line chart displaing incorrect line

Hello diegotam85,

Welcome to our forum and thanks for contacting us with your issue!

I know you said that your data is sorted but judging by looking at your chart it really seems like there is a problem with data order. Please check your console for any errors, especially error #15. If that is not the case then please provide me with sample of your data or preferably try to recreate the issue in a form of a live demo. You can start here: https://jsfiddle.net/BlackLabel/g96kt8jo/

Regards!
Mateusz Bernacik
Highcharts Developer

Return to “Highcharts Stock”