duanchuang3182
duanchuang3182
2014-06-01 17:31

使用JSON的Highcharts - 图形不显示mysql数据

I have been able to produce results from mysql using:

$myArray=array();
$tempArray = array();

// Get all records
while ( $row = $results->fetch_assoc())
{
    $tempArray = $row;
    array_push($myArray, $tempArray);
}
echo json_encode($myArray);

$mysqli->close();

 ?>

And I then included this to produce a chart on my page index.php by using the following Javascript.

what concepts/code am I not understanding/missing to produce a chart based upon my ajax json?

EDITED - SOLUTION:

Final PHP code to produce the json:

while ( $row = $results->fetch_assoc())
{   

    $tempArray[0] = $row['unix_timestamp(auct.end_date)'];
    $tempArray[0] *= 1000;
    $tempArray[1] = $row['winning_bid'];

    array_push($myArray, $tempArray);

}
echo json_encode ($myArray, JSON_NUMERIC_CHECK);

$mysqli->close();

 ?>

Final javascript code:

$('#btn_search').click(function(){
    txt_search = $('#txt_search').val();
    $.ajax({                                      
      url: './php/search.php',  
      type: 'GET',
      data: {search: txt_search}, 
      dataType: 'json',                   
      success: function(rows)      
      {

        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'chartdiv',
                type: 'line',
                marginRight: 100,
                marginBottom: 50
            },
            title: {
                text: 'Whisky Tracking',
                x: -20 //center
            },
            xAxis: {
                text: 'EndDate',
                type: 'datetime'
            },
            yAxis: {
                title: {
                    text: 'Price',
                    color: '#CC680E'
                }, 
                plotLines: [{
                    value: 0,
                    width: 20,
                    color: '#CC680E'
                }]
            },
            series: [{
            name:  txt_search,
            xAxis:0,
            data: rows,
                dataLabels: {
                    enabled: true,
                    formatter: function() {
                    return '£'+ Highcharts.numberFormat(this.y, 0);
                    }
                }
            }],         

        });
      }
    }); 
    goToByScroll('tracker');
    return false;
});  

Sample Data from the JSON:

[1306732000000,160],[1306745000000,45],[1306788000000,65],[1306788000000,50],[1306712000000,130],[1306733000000,240],[1306744000000,60],[1306788000000,250],[1306710000000,145]
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • donglei1699 donglei1699 7年前

    The problem is that values are strings, for example, your data:

    ["2011-05-30 00:00:00","130"]
    

    Should be instead:

    [1306706400000, 130]
    

    To it's timestamp in ms and true value.

    You can read about JSON_NUMERIC_CHECK option for json_encode(string, JSON_NUMERIC_CHECK) to change strings to numbers. But dates to timestamps you need to change on your own.

    Edit: Also the problem was with setting data in doubled array, changed from:

    data: [rows]
    

    to:

    data: rows
    
    点赞 评论 复制链接分享

相关推荐