饼图如何动态获取数据
0
[已解决问题]
解决于 2016-10-25 09:13
最佳答案
0
后台组织好数据，返回插件需要的Json传入就行了。Json也是可以自己手写拼写的1！
奖励园豆：5
<!doctype html>
json { "xList":["09-10", "09-11", "09-12", "09-13", "09-14", "09-15", "09-16"],//x轴的数据（折线、柱形） "yList":[{ "name": "日最高温","data": [28,28,27,26,29,32,25] }, { "name": "日最低温","data": [15,15,14,13,16,19,12] }], "zList":[{ "name": "降雨几率", "data": [16.0, 20.6, 48.5, 27.4, 19.1, 15.6, 0] },{ "name": "日降雨量", "data": [0.8, 0.5, 9.3, 1.0, 0.8, 0.6, 0] }],//折线图和柱形图是一致的 "dataList":[ ["城东",1],["平区",2],["东区",4],["西区",1],["郊区",1] ]//饼状图数据 }
读取不了json数据
@鑫昕: 你写个AJAX请求后台啊，然后自己按这种需要的格式拼写好数据，返回就行了！
@贫民窟大侠: 不会
@贫民窟大侠:
function showPie(){ $.ajax({ type: "get", url: "csylLine.json", async: true, dataType: "json", success:function(data){ $('#pieChart').highcharts({ chart : { plotBackgroundColor : null, plotBorderWidth : null, plotShadow : false, type: 'pie' }, title : { // 标题 text : '城关区一周降雨地区占全城份额比例' }, tooltip : { // 提示框 pointFormat : '{series.name}: {point.percentage:.1f}%' }, plotOptions : { pie : { allowPointSelect : true, cursor : 'pointer', dataLabels : { enabled : false }, showInLegend : true } }, series : [ { // 数据列 name : 'Browser share', data : data.dataList } ], credits:{ // 版权信息 enabled:false } }); }, error:function(err){ alert(err); } }); }
@鑫昕:
var $data = ""; function showPie() { //这段代码拿来取你的JSON数据。这Json格式你得在后台自己整理好正确返回。 $.ajax({ type: "get", url: "csylLine.json", async: false, dataType: "json", success: function (data) { $data = data; } }); return $data; } //插件这里应该就是给值填充的地方， series: [{ type: 'pie', name: '任务比例', data: [ showPie() ] }]
@贫民窟大侠: 我是做前端的也不会后台，你能给我发个小例子吗
@鑫昕: 你这个得让后台给你正确返回，你前端的你按照例子来就行，highchars有官方网站，你看着demo自己对照着来吧，我没有现成的例子，现成的例子官网多得是。http://www.hcharts.cn/demo/index.php
@贫民窟大侠: 恩谢了！
