How Can I draw Google Chart using jQuery ajax()?

Question

I have this code to generate chart:

<script type="text/javascript">

     google.load('visualization', '1.0', {'packages':['corechart']});
    $(document).ready(function() {

    $('.show_chart').click(function(){
        var sku = $(this).attr("data-sku");
        var vid = $(this).attr("data-vid");

        $.ajax({
             type: "POST",
             url:"../ajax/priceChart.php", 
             async: false,
             dataType:'text',//moment google apito mai ne go zaredi !
             data: {'sku':sku,'vid':vid},
             success:function(vals){
                 var vals = vals;
                 $(".dialog").dialog({
                    modal:true,
                    buttons: { "Cancel": function() { $(this).dialog("close"); } }
                });


drawChart(vals);
                return false;



            },
                error:function (xhr, ajaxOptions, thrownError){
                    alert(xhr.status);
                    alert(thrownError);
                }  
        });       
    }); 



    })
function drawChart(vals) {
        console.log(1);
        // Create the data table.
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Date');
        data.addColumn('number', 'New');
        data.addColumn('number', 'Old');
        data.addRows([
         // ['2012-03-29 16:36:58', 313.99000, 314.00000],
         // ['2012-03-29 16:36:58', 313.99000, 314.00000]
            vals

        ]);


        // Set chart options
        var options = {'title':'PriceChart'};

        // Instantiate and draw our chart, passing in some options.
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
        console.log(4);
      }  

</script>

The returning result from PHP is :

foreach ($arr as $v){
    $ts = $v['timestamp'];
    $p = $v['price'];
    $po = $v['price_old'];
    $resp[] = "[" 
                                    . "'$ts'" . ", "
                                    . "$p" . ", "
                                    . "$po"
                                    . "]";
}

echo implode(',',$resp);

If i using return result from the php file Google Chart don't work. If i using default values google chart work. Where is the problem ? Thanks in advance and I apologize for my english !

metalfight - user868766 · Accepted Answer · 2012-04-02 08:51:22Z

1

In drawchart function you have defined New and Old as number. You are getting double from PHP.

foreach ($arr as $v){
$ts = $v['timestamp'];
$p = (int) $v['price'];
$po = (int) $v['price_old'];
$resp[] = "[" 
                                . "'$ts'" . ", "
                                . "$p" . ", "
                                . "$po"
                                . "]";
}

echo implode(',',$resp);

Please try this code.

Hope this help.

~K

answered Apr 2, 2012 at 8:51

metalfight - user868766

2,7601 gold badge17 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How Can I draw Google Chart using jQuery ajax()?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related