amCharts 데이터를 더 똑똑하게 전달하는 방법

Question

amChart를 사용하는 데 jQuery가 필수는 아니라고 생각합니다. amCharts에서 jQuery를 사용하면 어떤 이점이 있습니까?

amCharts에서 사용되는 데이터와 관련하여 사용되는 열을 반복해서 반복하는 대신 데이터를 전달하는 데 "코딩이 적게 드는"방법이 있습니까?

var chartData = [{ country: "USA", visits: 4025, color: "#FF0F00" }, { country: "China", visits: 1882, color: "#FF6600" }, { etc....

그리고 마지막으로, 대신 반복 (동적으로 생성 된 차트에 대한 문제) 각자 정의의 차트를 구축 할 수있는 똑똑한 방법은 무엇입니까?

`

  // second graph        
      graph = new AmCharts.AmGraph(); 
      graph.title = "North America"; 
      graph.labelText = "[[value]]"; 
      graph.valueField = "namerica"; 
      graph.type = "column"; 
      graph.lineAlpha = 0; 
      graph.fillAlphas = 1; 
      graph.lineColor = "#D8E0BD"; 
      chart.addGraph(graph); 

      // thirdt graph    
      graph = new AmCharts.AmGraph(); 
      graph.title = "Asia-Pacific"; 
      graph.labelText = "[[value]]"; 
      graph.valueField = "asia"; 
      graph.type = "column"; 
      graph.lineAlpha = 0; 
      graph.fillAlphas = 1; 
      graph.lineColor = "#B3DBD4"; 
      chart.addGraph(graph); 

      // fourth graph 
      graph = new AmCharts.AmGraph(); 
      graph.title = "Latin America"; 
      graph.labelText = "[[value]]"; 
      graph.valueField = "lamerica"; 
      graph.type = "column"; 
      graph.lineAlpha = 0; 
      graph.fillAlphas = 1; 
      graph.lineColor = "#69A55C"; 
      chart.addGraph(graph); 

      // fifth graph 
      graph = new AmCharts.AmGraph(); 
      graph.title = "Middle-East"; 
      graph.labelText = "[[value]]"; 
      graph.valueField = "meast"; 
      graph.type = "column"; 
      graph.lineAlpha = 0; 
      graph.fillAlphas = 1; 
      graph.lineColor = "#B5B8D3"; 
      chart.addGraph(graph); 

      // sixth graph 
      graph = new AmCharts.AmGraph(); 
      graph.title = "Africa"; 
      graph.labelText = "[[value]]"; 
      graph.valueField = "africa"; 
      graph.type = "column"; 
      graph.lineAlpha = 0; 
      graph.fillAlphas = 1; 
      graph.lineColor = "#F4E23B"; 
      chart.addGraph(graph); 

`

감사

Answer 1

당신이 프로그래밍에 새로운 것을 같은 소리하고, 아니면 그냥 쓰는 간단한 스크립트 멀리 입수했습니다. 나는 디자인 패턴, OOP 비트 및 코드 추상화에 대한 독서를 시작하는 것이 좋습니다.

당신이 묻는 것을 달성하기위한 은색 총알이 없습니다. 그것은 백만 가지 방법으로 할 수 있습니다.

이제 질문에 다시 돌아와서 일반적인 구성 및 전달 된 속성을 사용하여 그래프를 만드는 함수를 만들 수 있습니다.

function createGraph(title, valueField, color){ 
     var graph = new AmCharts.AmGraph(); 
     graph.title = title; 
     graph.labelText = "[[value]]"; 
     graph.valueField = valueField; 
     graph.type = "column"; 
     graph.lineAlpha = 0; 
     graph.fillAlphas = 1; 
     graph.lineColor = color; 

} 


var chart = Amcharts....; 
var graphlist = [...]; 
for(int x = 0; x < graphlist; x++){ 
    chart.add(createGraph(graphList[x].title, graphList[x].valueField, graphList[x].color)); 
} 

행운을 빈다!

Answer 2

나는 가장 좋은 방법 중 하나는 데이터 로더 플러그인을 사용하고 CSV의 데이터 또는 모든 URL의 데이터를로드하는 것입니다. 이렇게하면 코드가 적게 유지되고 파일이나 URL에 따라 자주 변경 될 수도 있습니다 .

The data loader plugin information will be available here