JSON Highcharts -> пустой график

Question

У меня есть данные в формате JSON, сгенерированные preparejsongrapf.php с MySQL и вывод этого JSON данные:

[ 
    { 
     "name": "date", 
     "data": [ 
      "Date.UTC(2013,7,30)", 
      "Date.UTC(2013,8,5)", 
      ..........., 
      "Date.UTC(2013,10,29)" 
     ] 
    }, 
    { 
     "name": "solde", 
     "data": [ 
      17985.76, 
      17865.76, 
      17820.13, 
      ..........., 
      2867.88 
     ] 
    } 
] 

Я думаю, что мой синтаксис JSON хорош и сценарий Highcharts является:

<script> 
     $(document).ready(function() { 
      var options = { 
       chart: { 
        renderTo: 'graphsolde', 
        marginRight: 130, 
        marginBottom: 25, 
        zoomType: 'x', 
        spacingRight: 20 
       }, 
       title: { 
        text: 'CDN', 
        x: -20 //center 
       }, 
       subtitle: { 
        text: '', 
        x: -20 
       }, 
       xAxis: { 
        type: 'datetime', 
        categories: [{}], 
        maxZoom: 14 * 24 * 3600000, // fourteen days 
        title: { 
         text: null 
        } 
       }, 
       yAxis: { 
        title: { 
         text: 'Solde' 
        }, 
        plotLines: [{ 
          value: 0, 
          width: 1, 
          color: '#808080' 
         }] 
       }, 
       tooltip: { 
              } 
       }, 
       legend: { 
        layout: 'vertical', 
        align: 'right', 
        verticalAlign: 'top', 
        x: -10, 
        y: 100, 
        borderWidth: 0 
       }, 
       plotOptions: { 
        area: { 
         fillColor: { 
          linearGradient: {x1: 0, y1: 0, x2: 0, y2: 1}, 
          stops: [ 
           [0, Highcharts.getOptions().colors[0]], 
           [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')] 
          ] 
         }, 
         lineWidth: 1, 
         marker: { 
          enabled: false 
         }, 
         shadow: false, 
         states: { 
          hover: { 
           lineWidth: 1 
          } 
         }, 
         threshold: null 
        } 
       }, 
       series: [{}] 
      } 
      $.getJSON("preparejsongrapf.php", function(json) { 
       options.xAxis.categories = json[0]['data']; 
       options.series[0] = json[1]; 
       chart = new Highcharts.Chart(options); 
      }); 
     }); 
    </script> 
</script><div id="graphsolde" style="width:100%; height:600px;"></div> 

Диаграмма отображается на экране, но без данных JSON. Что не так в getjson?

Answer 1

Сравните ваш формат данных JSON с Highchart. Проверьте формат JSON и формат Highchart. Highchart имеет отдельный формат для ввода.

Answer 2

ли что-то подобное - итерацию по массиву:

$.getJSON('chart_helpers/acme_charthelper.php?callback=?', function(data) { 

       $.each(data, function(key, value) { 
        var series = {data: []}; 

        if (key == 'Inbound' || key == 'Outbound') { 
         series.dataGrouping = {enabled: false}; 

         series.name = key; 

         if (key == 'Inbound') { 
          series.color = "#85d635"; 
         } 
         else { 
          series.color = "#59d5ff"; 
         } 

         $.each(value, function(key, val) { 

          series.data.push([key * 1000, val]); 

         }); 
         options.series.push(series); 
        } 

        if (key === 'Max') { 

         series.type = 'flags'; 

         $.each(value, function(key, val) { 
          series.title = 'Max: ' + val + ' Calls'; 

          series.data.push([key * 1000, val]); 
          max = val; 
         }); 
         options.series.push(series); 
        } 

       }); 

       var chart = new Highcharts.Chart(options); 

Answer 3

Это "Date.UTC(2013,7,30)", .. так неправильно .. Это просто строка, если вы хотите передать дату, используйте метку времени. Итак, на вашем сервере, создайте отметку времени в миллисекундах, например:

"Date.UTC(2013,7,30)" -> 1377820800000