如何使用我的有效本地文件(json)使我的 chartData 动态化? [英] How to make my chartData dynamic using my valid local file(json)?

查看:25
本文介绍了如何使用我的有效本地文件(json)使我的 chartData 动态化?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个 pieChart(下面的示例工作链接),但我想要的是从我的本地文件中获取我的图表数据,这样它就不会被硬编码.我在这方面有困难.

I have a pieChart(sample working link below), but what I want is to get my chartData from my local file so it would not be hard coded. I'm having difficulty in this one.

请注意,我有有效的 JSON 文件,我对其进行了测试并且可以正常工作.当我将我的 JSON 文件分配给 var chartData = "validJsonFile.json" 时,它不起作用.我的图表根本不显示任何内容.

Note that I have valid JSON file, which I test and it works. When I did is to assign my JSON file to the var chartData = "validJsonFile.json", it is not working. my chart displays nothing at all.

我希望有人能帮助我.谢谢.

I hope someone can help me. Thanks.

示例工作图表链接在这里

我尝试过但没有用的东西:

the thing i tried but didnt work:

var chartData = "validjsonfile.json";

有效的东西,但它不是动态的.

the thing that works, but it is not dynamic.

var chartData = [{
"title": "Marketing",
"value": 23,
"url":"#",
"description":"click to drill-down",
"data": [
{ "title": "Jan", "value": 1, "data": [
  { "title": "AAA", "value": 2 },
  { "title": "BBB", "value": 5 },
  { "title": "CCC", "value": 1 },
] }, /* and so on...... */

请帮助...在此先感谢您...

Please help.. Thanks you so much in advance...

推荐答案

好吧,经过这么多次尝试,我找到了答案..哈哈!我好开心..

Well, after so many tries i found out an answer.. haha! I'm so happy..

var chartData;
AmCharts.loadFile("dataPieJson.json", {}, function(data) {
var chartData = AmCharts.parseJSON(data);
console.log(chartData); // this will output an array
chart.dataProvider = chartData;
chart.validateData();
});


// create pie chart
var chart = AmCharts.makeChart("chartdiv", {
"type": "pie",
"dataProvider": chartData,
"valueField": "value",
"titleField": "title",
"labelText": "[[title]]: [[value]]",
"pullOutOnlyOne": true,
"titles": [{

"text": "Most Sold Products"
}],
"allLabels": []
});

这篇关于如何使用我的有效本地文件(json)使我的 chartData 动态化?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆