我真的是剑道和 JavaScript 的新手,并且在让散点图正确分组时遇到问题。该图表确实呈现,只是没有分组。
这是我得到的数据示例:
"GradeLevel": "12",
"StudentCount": 7,
"StudentRiskFactor": 5.18
},
{
"GradeLevel": "12",
"StudentCount": 10,
"StudentRiskFactor": 5.18
},
{
"GradeLevel": "9",
"StudentCount": 1,
"StudentRiskFactor": 5.18
},
{
"GradeLevel": "9",
"StudentCount": 2,
"StudentRiskFactor": 5.18
},
{
"GradeLevel": "9",
"StudentCount": 3,
"StudentRiskFactor": 5.18
这是我用来创建图表的代码:
kcSchoolCrosstab = $("#SchoolCrosstab").kendoChart({
title: {
text: "Crosstab",
font: "bold 16px Arial,Helvetica,Sans-Serif"
},
legend: {
visible: false
},
dataSource: {
transport: {
read: function (options) {
if (!(ktvSchoolFilter && ktvSchoolFilter.getSelectedSchoolCodes() && getSelectedSchoolYear())) {
options.success([]);
return;
}
kendo.ui.progress(kcSchoolCrosstab.element, true);
$.getJSON(Helpers.toServicesUrl("/GetEWSSchoolCountVsRiskScore"),
{
username: WSIPCContext.UserName,
districtId: WSIPCContext.DistrictId,
schoolCodes: ktvSchoolFilter.getSelectedSchoolCodes(),
schoolYear: getSelectedSchoolYear,
// countOfEvents: 3,
countOfEvents: getRiskCatCount(),
whereIds: "1"
}).success(function (data) {
options.success([]);
kcSchoolCrosstab.dataSource.data(data.GetEWSSchoolCountVsRiskScoreResult.RootResults);
}).always(function () {
kendo.ui.progress(kcSchoolCrosstab.element, false);
});
},
group: {
field: "GradeLevel"
},
sort: {
field: "StudentCount"
},
schema: {
data: "GetEWSSchoolCountVsRiskScoreResult.RootResults"
}
}
},
series: [{
type: "scatter",
xField: "StudentRiskFactor",
yField: 'StudentCount',
color: "#4F82BE"
name: "#= group.value"
}],
legend: {
position: "bottom"
},
xAxis: {
labels: {
step: 2,
format: "{0}%"
},
title: {
text: "Avg. School Risk Score",
font: "bold 12px Arial,Helvetica,sans-serif"
} ,
majorGridLines: {
color: "#C0C0C0"
},
minorGridlines: {
color: "#C0C0C0"
}
},
valueAxis: [{
majorGridLines: {
color: "#C0C0C0"
},
minorGridlines: {
color: "#C0C0C0"
}
}],
categoryAxis: [{
majorGridLines: {
color: "#C0C0C0"
},
minorGridlines: {
color: "#C0C0C0"
}
}],
yAxis: {
labels: {
skip: 2,
step: 2
},
title: {
text: "Avg. School Count",
font: "bold 12px Arial,Helvetica,sans-serif",
margin: {
right: 10
}
}
chartArea: {
height: 300,
width: 500
}
}).data("kendoChart");
},
任何帮助将不胜感激!谢谢。