2016-08-30 75 views
1
我使用AmCharts我AngularJs應用

,這是JSON數據,我得到的結果:如何訪問嵌套的JSON數據在AmCharts

{ 
total: 2, 
tools: [ 
{ 
id: "57c5a75d57d92f742dc96bf2", 
empId: "1", 
empName: "ABC", 
empType: { 
typeId: 3, 
typeName: "Contract", 
hours: 45, 
} 
}, 
{ 
id: "57c5a75d57d92f742dc96bf2", 
empId: "2", 
empName: "DEF", 
empType: { 
typeId: 2, 
typeName: "Full-Time", 
hours: 40, 
} 
}, 


] 
} 

代碼在我的控制器:

const writeemp = data => { 
     const { 
      total, 
      employees, 
     } = data; 

     empChart.dataProvider = employees; 
     empChart.write('emp'); 
     empChart.validateData(); 
    }; 

    AmCharts.handleLoad(); 

    var configChart = function() { 


     empChart = new AmCharts.AmSerialChart(); 
     empChart.categoryField = "empId"; 
     empChart.labelRotation = 90; 

     var yAxis = new AmCharts.ValueAxis(); 
     yAxis.position = "left"; 
     empChart.addValueAxis(yAxis); 


     empBarGraph = new AmCharts.AmGraph(); 
     empBarGraph.valueField = "";//This to be the value "TypeName" in "empType" from the Json Data 
     empBarGraph.type = "column"; 
     empBarGraph.fillAlphas = 1; 
     empBarGraph.lineColor = "#f0ab00"; 
     empBarGraph.valueAxis = yAxis; 
     empChart.addGraph(empBarGraph); 
     empChart.write('empChart'); 


     $http.get(hostNameService.getHostName()+"/dashboard/employees") 
      .then(response => writeemp(response.data)); 
    } 

莫非有人讓我知道如何在Amcharts中訪問嵌套的Json數據。我想在圖表中將其中一個字段作爲我的valueField。

回答

1

AmCharts不支持嵌套的JSON集。您必須將數據重構爲包含valueField(s)和categoryField的扁平對象數組。你的情況:

[ 
    { 
    "empId": 1, 
    "typeName": "Contract" 
    }, 
// ... 
] 

注意,圖表只能支持數值數值軸,所以「的typeName」是不恰當的valueField。

+0

感謝您的幫助。在這種情況下,我創建了一個自定義數據結構。是的,我明白我們只能使用數字作爲圖表中的值字段。 – Valla