2014-01-04 5 views
1

Предыдущая помощь привела меня к текущему этапу с моим проектом Highcharts, однако я все еще нахожусь в главном камне преткновения. График Highcharts не загружает данные, полученные с помощью .getJSON. Я не понимаю, почему html не отображает диаграмму и не загружает данные из data.php. Весь код ниже, есть ли у кого-нибудь идеи? @ PawełFusHighcharts .getJSON - график не для построения

PHP

<?php 

$con = mysql_connect("ip_address","root",""); 

if (!$con) { 
    die('Could not connect: ' . mysql_error()); 
} 

mysql_select_db("test", $con); 

$result = array(); 

$sql = mysql_query("SELECT unix_timestamp(DATETIMES), TEST FROM PR"); 

$result['name'] = 'TEST'; 
while($r = mysql_fetch_array($sql)) { 
    $datetime = $r[0]*1000; 
    $result['category'][] = $datetime; 
    $result['data'][] = round($r[1],2) ; 
} 

$json = array(); 
array_push($json,$result); 
print json_encode($json); 


?> 

PHP возвращение

[{"name":"CCGT","category":[1387791900000,1387792200000,1387792500000,1387792800000],"data":[8389,8478,8761,8980,9050]}] 

HTML

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
     <title>Highcharts Example</title> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
      var options = { 
       chart: { 
        renderTo: 'container', 
        type: 'line', 
        marginRight: 130, 
        marginBottom: 25 
       }, 
       title: { 
        text: 'test', 
        x: -20 //center 
       }, 
       subtitle: { 
        text: '', 
        x: -20 
       }, 
       xAxis: { 
        categories: [] 
       }, 
       yAxis: { 
        title: { 
         text: 'test' 
        }, 
        plotLines: [{ 
         value: 0, 
         width: 1, 
         color: '#808080' 
        }] 
       }, 
       tooltip: { 
        formatter: function() { 
          return '<b>'+ this.series.name +'</b><br/>'+ 
          this.x +': '+ this.y; 
        } 
       }, 
       legend: { 
        layout: 'vertical', 
        align: 'right', 
        verticalAlign: 'top', 
        x: -10, 
        y: 100, 
        borderWidth: 0 
       }, 
       series: [] 
      } 

      $.getJSON("data.php", function(json) { 
       options.xAxis.categories = json['category']; 
       options.series[0].name = json['name']; 
       options.series[0].data = json['data']; 
       chart = new Highcharts.Chart(options); 
      }); 
     }); 
     </script> 
     <script src="http://code.highcharts.com/highcharts.js"></script> 
     <script src="http://code.highcharts.com/modules/exporting.js"></script> 
    </head> 
    <body> 
     <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div> 
    </body> 
</html> 

ответ

2

Ваш массив серии (в Opti ons) не имеет объекта, поэтому вы не можете использовать серию [0] .name. Во-вторых ваш JSON не используется правильно, но попробуйте заменить эти строки:

options.xAxis.categories = json['category']; 
options.series[0].name = json['name']; 
options.series[0].data = json['data']; 

с

options.xAxis.categories = json[0]['category']; 
options.series[0] = {}; 
options.series[0].name = json[0]['name']; 
options.series[0].data = json[0]['data']; 
+0

Спасибо за ответ Себ. Замена линии параметров приводит к частичному успеху. Теперь диаграмма рендеринга (с правильным названием серии), однако данные по-прежнему не отображаются. Здесь приведен пример здесь [link] (http://energydata.dyndns.org/fiddle10.html), вывод data.php здесь [link] (http://energydata.dyndns.org/data.php). Консоль Chrome показывает ошибку highcharts.js 19. Не знакомы с отладкой Highcharts, какие-либо идеи? – user3080213

+0

Вы используете этот json или другой? –

+0

json в оригинальном посте был предназначен для тестирования и является подмножеством связанного json. – user3080213

Смежные вопросы