amcharts指定唯一键作为字段
问题描述:
我想使用amcharts来显示一些数据。 我在这个格式一些JSON数据从URL:amcharts指定唯一键作为字段
var jsondata = {
"name1" : {
"key1": 5,
"key2": "value1",
"data": {
"data1": {
"field1": 2,
"field2": 3,
"field3": 4
}
}
},
"name2" : {
"key1": 5,
"key2": "value1",
"data": {
"data2": {
"field1": 2,
"field2": 3,
},
"data3": {
"field1": 2,
"field2": 3,
}
}
}
}
在一个实例中使用的名称密钥作为x轴和KEY1为y。 在另一个使用data1/2/3作为x及其所需的字段。
但是本例中的name1/name2和data1/data2/data3是唯一/动态生成的。
如果有引用这些键的简单方法,或者如果我最好以另一种方式呈现数据以使其更容易访问,我不确定使用javascript吗? 如果是这样,你会怎么最好地代表JavaScript中的数据?
答
amCharts需要一个dataProvider
在一定的格式。格式总是这样:
[{
"category": "Company A",
"value": 100
}, {
"category": "Company B",
"value": 200
}, {
// etc ...
}]
您可以category
和value
使用不同的密钥名称,但数据提供程序应始终对象的数组。
你可以将你的jsondata转换成这种格式。这非常简单。假设名1和名2键实际上是类:
var my_dataprovider = [];
for(category in jsondata){
my_dataprovider.push({
"category": category,
"key1": jsondata[category].key1,
"key2": jsondata[category].key2
});
}
如果您还需要嵌套领域成为amCharts访问,我将“扁平化”起来:
var my_dataprovider = [];
for(category in jsondata){
var data_item = {
"category": category,
"key1": jsondata[category].key1,
"key2": jsondata[category].key2
};
// flatten nested fields (inside "data")
for(key in jsondata[category].data){
// data1... or data2, data3...
for(field in jsondata[category].data[key]){
// field1, field2...
data_item[key + '_' + field] = jsondata[category].data[key][field];
}
}
/*
{
"category": "name1",
"key1": 5,
"key2": "value1",
"data1_field1": 2,
"data1_field2": 3,
"data1_field3": 4
}
*/
my_dataprovider.push(data_item);
}
你可以将您的amCharts图形的valueField
设置为dataProvider中的其中一个键。
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"dataProvider": my_dataprovider,
"categoryField": "category",
"graphs": [{
// ...
"valueField": "data1_field1"
}]
});
谢谢!这正是我需要它来运作的。 – ninjasloth22