Highchart与Ajax请求

Good day, i'm trying to create a chart. The chart value is from ajax return.

I got this data

"tgl":["2016-07-12 00:00:00.000","2016-07-01 00:00:00.000"],"total":[1283947,1234618514]}

and here it's my js for handle hightchart

 xAxis: {
            categories: [
             $.each(data.tgl, function(k, v) {
                    data.tgl
             })
                ]
            },
  series: [{
            name: 'Outlet' +$("#outlet").val(),
                    data: [
                        $.each(data.total, function(k, v) {
                                data.total
                            })
                    ]

        }]

i don't know how to foreach ajax so i follow this link jQuery loop over JSON result from AJAX Success?

and here is my php

function getajax()
    {
        extract(populateform());
        $explode = explode('-',$date_search);
        $start_date = inggris_date($explode[0]);
        $end_date = inggris_date($explode[1]);

        $hasil = $this->modelmodel->showdata("select tanggal,(cash + cc + dc + flash + piutang + reject + disc50)
                                                total from transaksi 
                                                where tanggal between '$start_date' and '$end_date' and
                                                outlet = '".$outlets."' order by tanggal desc");

        $data = array();
        foreach($hasil as $hsl)
            {
                $data['tgl'][] = $hsl->tanggal;
                $data['total'][] = $hsl->total;
            }   
        echo json_encode($data);
    }

The result from my script above is like this.

enter image description here

as you can see from my data above. My chart not showing the right value. It should be like this 2016-07-12 00:00:00.000 => 1283947 and 2016-07-01 00:00:00.000 => 1234618514

enter image description here

My lates fiddle https://jsfiddle.net/oyrogu9v/1/

you should have 2 values in the series: time and total.

  series: [{
        name: 'Winter 2012-2013',
        data: [
            [Date.UTC(1970, 9, 21), 0],
            [Date.UTC(1970, 10, 4), 0.28],
           ..................

you can see here a sample: Highchart sample timeserie

please try this code:

$(document).ready(function() {

    $("#test").click(function() {
        var $btn = $(this);
        $btn.button('loading');
             $.ajax({
                 url: '<?=base_url();?>graph/getajax',
                 data: {outlets:$("#outlet").val(),date_search:$("#reservation").val()},
                 type: 'POST',
                 dataType: 'JSON',
                 success: function(data) {
                        var res= [];
          $.each(data, function(k, v) { 
                                            res.push([new Date(data[k].tanggal).getTime(), data[k].total])});

                $('#container').highcharts({
                            title: {
                                text: '',
                                x: -20 //center
                            },
                            subtitle: {
                                text: 'Omset ' + $("#outlet").val(),
                                x: -20
                            },
                            xAxis: {
                                type: 'datetime'
                            },
                            yAxis: {
                                title: {
                                    text: 'Rupiah (Rp.)'
                                },
                                plotLines: [{
                                    value: 0,
                                    width: 1,
                                    color: '#808080'
                                }]
                            },
                            tooltip: {
                                valueSuffix: ' Rupiah'
                            },
                            legend: {
                                layout: 'vertical',
                                align: 'right',
                                verticalAlign: 'middle',
                                borderWidth: 0
                            },

                            series: [{
                                name: 'Outlet '+ $("#outlet").val(),
                                data:res
                            }]

                        });

                    });

        setTimeout(function () {
            $btn.button('reset');
        }, 1000);
    });

});

here you can see the results: https://jsfiddle.net/mb89apxr/