2016-08-30 73 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