2015-11-20 1 views
0

Я пытаюсь создать тип столбца highchart, используя данные из JSON в следующем формате:Создать тип Highcharts-столбец из JSON

[{"id":7,"dateV":"2015-11-16","count":10},{"id":6,"dateV":"2015-11-15","count":3},{"id":5,"dateV":"2015-11-14","count":15},{"id":4,"dateV":"2015-11-13","count":10},{"id":3,"dateV":"2015-11-12","count":6},{"id":2,"dateV":"2015-11-11","count":8},{"id":1,"dateV":"2015-11-10","count":5}] 

ось Х должна показать значение даты и ось Y должна показывать количество , Как-то я не могу преобразовать этот JSON в требуемом формате.

Вот мой код.

<script type="text/javascript"> 
     $('#myButton').click(function() { 
      var options = { 
        chart: { 
         renderTo: 'chartContainerDiv', 
         type: 'column' 
        }, 
        series: [{}] 
       }; 

       var url = "callToControllerURL"; 
       $.getJSON(url, function(data) { 
        console.log(JSON.stringify(data)); 
        options.series[0].data = JSON.stringify(data); 
        var chart = new Highcharts.Chart(options); 
       }); 
      }); 
    </script> 

Консольный журнал показывает JSON в формате, указанном выше. Я предполагаю, что мне нужно сформировать значения оси x и y из массива опций. Как мне это сделать?

ответ

1

Вам необходимо перебрать данные json и создать данные и серию категорий, нажав значения.

var jsonData = [{"id":7,"dateV":"2015-11-16","count":10},{"id":6,"dateV":"2015-11-15","count":3},{"id":5,"dateV":"2015-11-14","count":15},{"id":4,"dateV":"2015-11-13","count":10},{"id":3,"dateV":"2015-11-12","count":6},{"id":2,"dateV":"2015-11-11","count":8},{"id":1,"dateV":"2015-11-10","count":5}]; 

var categoryData= []; 
var seriesData= []; 
$.each(jsonData, function(i,item){ 
seriesData.push(jsonData[i].count); 
categoryData.push(jsonData[i].dateV); 
console.log("seriesData"+JSON.stringify(seriesData)); 
}); 

См Working demo with your json here

+0

Это работает. Скрипт помог мне сыграть с решением. Спасибо. – Ninja