如何在 AmCharts 中访问嵌套的 Json 数据 [英] How to access nested Json Data in AmCharts
问题描述
我在我的 AngularJs 应用程序中使用 AmCharts,这是我返回的 Json 数据:
<代码>{总计:2,工具: [{id: "57c5a75d57d92f742dc96bf2",empId: "1",empName: "ABC",emp类型:{类型 ID:3,typeName: "合同",小时:45,}},{id: "57c5a75d57d92f742dc96bf2",empId: "2",empName: "DEF",emp类型:{类型 ID:2,typeName: "全职",小时:40,}},]}
我的控制器中的代码:
const writeemp = data =>{常量{全部的,雇员,} = 数据;empChart.dataProvider = 员工;empChart.write('emp');empChart.validateData();};AmCharts.handleLoad();var configChart = 函数 () {empChart = new AmCharts.AmSerialChart();empChart.categoryField = "empId";empChart.labelRotation = 90;var yAxis = new AmCharts.ValueAxis();yAxis.position = "左";empChart.addValueAxis(yAxis);empBarGraph = new AmCharts.AmGraph();empBarGraph.valueField = "";//这是Json数据中empType"中的TypeName"值empBarGraph.type = "列";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.
AmCharts 不支持嵌套的 JSON 集.您必须将数据重组为包含 valueField(s) 和 categoryField 的扁平对象数组.在你的情况下:
<预><代码>[{"empId": 1,"typeName": "合同"},//...]请注意,图形只能支持数值轴的数值,因此typeName"不是合适的 valueField.
I am using AmCharts in my AngularJs Application and this is the Json Data which I get back:
{
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,
}
},
]
}
Code in my controller:
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));
}
Could someone let me know how I could access nested Json data in Amcharts. I want to make one of the fields as my valueField in the chart.
AmCharts doesn't support nested JSON sets. You have to restructure your data as a flattened array of objects containing your valueField(s) and categoryField. In your case:
[
{
"empId": 1,
"typeName": "Contract"
},
// ...
]
Note that graphs can only support numeric values for the value axis, so "typeName" isn't an appropriate valueField.
这篇关于如何在 AmCharts 中访问嵌套的 Json 数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!