how to make chart real time with 2 line and get data from php with highcharts

Question

hello i want make chart with use php for get my data

here my script

 series: [{
            name: 'Random data',
            data: [<?php echo $row['rx-bits-per-second'] ?>]
        },
                {
            name: 'Random data',
            data: [<?php echo $row['tx-bits-per-second'] ?>]
        }]

full script highcharts here :

 $(document).ready(function() 
      {
        $('#dataTable').DataTable();
      });
</script>


<script>

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

        var chart;
        $('#container').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 series2 = this.series[1];
                        setInterval(function() {
                            var x = (new Date()).getTime(), // current time
                                y = Math.random();
                                z = Math.random();
                            series.addPoint([x, y], false, true);
                            series2.addPoint([x, z], true, true);
                        }, 1000);
                    }
                }
            },
            title: {
                text: 'Live random data'
            },
            xAxis: {
                type: 'datetime',
                tickPixelInterval: 150
            },
            yAxis: [{
                title: {
                    text: 'Value1'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            {
                title: {
                    text: 'Value2'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            }],
            tooltip: {
                formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+
                        Highcharts.numberFormat(this.y, 2);
                }
            },
            legend: {
                enabled: false
            },
            exporting: {
                enabled: false
            },
            series: [{
                name: 'Random data',
                data: [<?php echo $row['rx-bits-per-second'] ?>]
            },
                    {
                name: 'Random data',
                data: [<?php echo $row['tx-bits-per-second'] ?>]
            }]
        });
    });
});

and point for get data here <?php echo $row['tx-bits-per-second'] ?>

but line from chart show null. can you help me?

Thanks.

Answer 1

In that 'source' object, remove the PHP for now and add simple values like in the highcharts examples. Make sure that is solid before continuing.

Once you're sure, add single quotes around the php tags and try it again.

If it still has trouble I would do a "View Source" on the page to check if the 'data' properties in that 'source' object array were populated properly. Hard to continue without knowing how that PHP comes out