Highcharts+asp.net+SqlServer 画饼状图？？？
0
悬赏园豆：5
[已解决问题]
解决于 2016-01-20 14:27
后台已经取到数据了要在前台用Highcharts画出饼状图，请问
xAxis：{ 这里面该怎么写？？ }！！！！急急急！！！
js我是这样写的，请大神看看是否正确？？
var chart;
$(function () {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
defaultSeriesType: 'pie'
},
title: {
text: '年龄统计'
},
subtitle: {
text: 'Source: 下级人员' //图标的副标题
},
xAxis: {
categories: <%= xAxisCategories %>,//从后台获取数据
tickPixelInterval:0.2,
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: '年龄 (岁)',
align: 'high'
}
},
tooltip: {
formatter: function() {
return ''+
this.series.name +': '+ this.y +' 岁';
}
},
plotOptions: {
column: {
pointPadding: 0.3,
borderWidth: 0
},
bar: {
dataLabels: {
enabled: true
}
}
},
legend: {
layout: 'horizontal',
align: 'center',
verticalAlign: 'top',
y: 50,
borderWidth: 1,
backgroundColor: '#FFFFFF',
borderColor: '#CCC',
shadow: true
},
credits: {
enabled: false
},
series: <%= Result %> //此处数据从后台获取
});
});
最佳答案
0
我没看懂你想要什么功能，如果是《Slice》显示错误的问题的话，那么我告诉你：
饼图其实不用改xAxis的，
可以改
series: [{ type: 'pie', data: [ ['a', 45.0], ['b', 26.8], ['c', 8.5] ] }]
这里面的abc就是显示的名称
收获园豆：5
你这个的data数据是手动写的，如果是自动读取数据库里面的信息呢，这个地方该怎么写？
@hslgmq: 这要看你后台是怎么写的了，你在后台生成这种格式就可以了啊
@刘宏玺: 后台我就是这样拼接的。
@hslgmq: 看来你的 item["ApplyPerson"]里面的值都是“Slice” 吧？
@hslgmq: 你把 <%= xAxisCategories %>这里的值换成 item["ApplyPerson"]，应该显示就对了
@刘宏玺: 有啊，按我这种写法，柱状图都可以正确显示。就是换成饼状图的时候这里变成了Slice
@hslgmq: 那你吧截图发多点，我看看你的xAxisCategories 是怎么写的
@hslgmq: 哦，你这里有，我看迷糊了，不用发了，等下
@刘宏玺: 
后台代码就这些，我要在页面加载后就显示图表
@hslgmq: 你的foreach这样写：
foreach(DataRow item in dt.Rows) {
dataX += "," + item["ApplyPerson"].ToString() + "',"; dataY += "['" + item["ApplyPerson"].ToString() + "'," + item["Age"].ToString() + "],"; }
@hslgmq: 柱状图显示的话，如果有多个Series,series: <%= Result %> //这里该怎么写，你知道吗？
@刘宏玺: 柱状图显示的话，如果有多个Series,series: <%= Result %> //这里该怎么写，你知道吗？
@hslgmq: 要学以致用，去官网上面看看就知道怎么用了！
@刘宏玺: 方便留个QQ吗？这方面我有点问题可以请教一下你吗？我给你发了私信了。
其他回答(1)
0
可以考虑Ajax异步取数据然后将数据处理一下填到你需要的取数据地方， 你用<%%>取后台数据直接在JS里赋值貌似是不大行得通的
<%%>这样取得数据 柱状图和曲线图都可以正确显示出来，就是饼状图不行啊！！！！不知道为什么
@hslgmq: 数据取对了没 还是没数据
@sunshine.pl: 数据取对了的。柱状图都能真确显示
@hslgmq: 那就不清楚了 看下API 用法是不是一样用
