使用ajax/ json和SQL Server ASP.NET的Highcharts
使用ajax/ json和SQL Server ASP.NET的Highcharts
提问于 2020-12-08 08:14:54
我刚接触Highcharts和Json data。我试着画非常简单的柱状图，但做不到。下面是我的代码。
HTML：
<div id="container"></div>Javascript：
$(document).ready(function () {
$.ajax({
url: 'HighCharts.aspx/GetServices',
type: 'POST',
async: true,
dataType: 'json',
contentType: 'application/json',
data: '{}',
success: function (response) {
DrawServices(response.d);
},
error: function () {
window.open("ErrorPage.aspx", "_self")
}
});
});
function DrawServices(data) {
debugger;
if (data == null) {
window.open("ErrorPage.aspx","_self")
}
else {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Services Data'
},
xAxis: {
categories: data[0].Name
},
yAxis: {
title: {
text: 'Total Servcies Requested'
}
},
series: data[0].Total
});
}
}JSON响应
[{"Name":"Access the company internet","Total":489},{"Name":"Application Enhancement","Total":97},{"Name":"Catering Service","Total":250},{"Name":"Desktop","Total":350},{"Name":"Development and Consultation","Total":566},{"Name":"Email","Total":175},{"Name":"Laptop","Total":200},{"Name":"Maintenance","Total":32},{"Name":"Push Email","Total":700},{"Name":"Vehicle Sticker","Total":1200}]请指点我哪里做错了。正在显示空白图表
回答 1
Stack Overflow用户
发布于 2020-12-08 10:17:19
您可以将x轴类型设置为category，并将数据映射为Highcharts所需的格式，例如：[point.name, point.y]
xAxis: {
type: 'category'
},
series: [{
data: data.map(el => [el.Name, el.Total])
}]现场演示： http://jsfiddle.net/BlackLabel/r709soxe/
接口参考：
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65195337
复制相关文章
相似问题
社区富文本编辑器全新改版！诚邀体验～
全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验
腾讯云开发者
