2014-04-09 5 views
0

PHP를 사용하여 json을 Highcharts로 전달합니다. 내 PHP는 다음과 같습니다 JSON을 반환 :HIghcharts and dynamic json

{"A":5,"B":12,"C":5,"D":11,"E":6} 

어떻게 범주로 차트를 구축 가겠어요 : A, B, C, D, E와 값 : 5,12,5,11, 6?

나는 사용하여 시도했다 :

$.getJSON("test.php", function(json){ 
      $.each(json, function(i, e) { 
      options.series.data= json; 
       }); 
      chart = new Highcharts.Chart(options); 

      }); 

나는 이것이 바로 JSON을 모두 복용하고 잘못입니다 series.data에 덤프하려고 알고있다. 키와 값을 분리하는 가장 좋은 방법은 무엇입니까? 이것은 PHP 측 또는 자바 스크립트에서 처리해야합니까?

감사

답변

2

나는 당신을위한 클래스를 작성했습니다, 그래서 당신은 어디서든 사용할 수 있습니다 :

HighChartObject = function (obj) { 
    if (typeof obj === 'string') obj = JSON.parse(obj); 

    for (var key in obj) { 
     this[key] = obj[key]; 
    } 
} 

HighChartObject.prototype.getDataArray = function() { 
    var arr = []; 

    for (var key in this) { 
     if (this.hasOwnProperty(key)) { 
      arr.push(obj[key]); 
     } 
    } 

    return arr; 
} 

HighChartObject.prototype.getCategoriesArray = function() { 
    var arr = []; 

    for (var key in this) { 
     if (this.hasOwnProperty(key)) { 
      arr.push(key); 
     } 
    } 

    return arr; 
} 

사용법 :

var json = '{ "A": 5, "B": 12, "C": 5, "D": 11, "E": 6 }'; 
var obj = new HighChartObject(json); 

$("#container").highcharts({ 
    xAxis: { 
     categories: obj.getCategoriesArray() 
    }, 
    series: [ 
     { 
      name: "MyName", 
      data: obj.getDataArray() 
     } 
    ] 
}); 

그리고 here there is a FIDDLE, 당신은 재생할 수 있습니다 그것으로!

정확하게 필요한지 모르겠지만 필요에 맞게 코드를 개선 할 수 있다고 생각하십니까?

나는 그것이 당신을 도울 수 있기를 바랍니다. =)

+0

정말 멋진 코드입니다. 개체를 초기화 할 때 모든 속성을 한 번만 반복하면 작업 속도가 빨라질 것이라고 생각합니다. :) –