We are trying to group some data for display using a Column chart. This works fine in IE, Safari etc, but when viewing in Chrome the data is mixed up, with values not falling into the correct groups. Removing the grouping shows that the data being handled is exactly the same in all browsers. Has anybody else come across this issue, and if so are there any known workarounds?
For info, the function in which grouping takes place is as follows:
For info, the function in which grouping takes place is as follows:
function
ajaxCallColumn(div, hier, dsField, stck, catAxisField, filter, srsClk, data) {
$.ajax({
url:
'/api/Chart/'
,
cache:
false
,
type:
'POST'
,
contentType:
'application/json; charset=utf-8'
,
data: JSON.stringify(data
),
success:
function
(result) {
$(div).kendoChart({
dataSource: {
data: result,
group: {
field: dsField
},
filter: { field:
"Category"
, operator:
"neq"
, value: categorySwitch }
},
chartArea: {
background:
"transparent"
},
title: {
text: result[0][
"TableCaption"
]
},
seriesColors: [
"#007c85"
,
"#f3901d"
,
"#b2bb1e"
,
"#a40046"
,
"#00aeef"
,
"#ffcc00"
,
"#5f6062"
,
"#25567b"
,
"#ccccff"
,
"#380470"
,
"#6FFF00"
,
"#9000FF"
],
legend: {
visible:
true
},
series: [{
type:
"column"
,
field:
"Value"
,
tooltip:{
visible:
true
,
template:
"#= series.name # - #= value #"
}
}],
seriesClick: srsClk,
categoryAxis: {
field: catAxisField,
labels: {
rotation: 90
}
}
});
},
error:
function
(result) {
if
(result.status != 401) {
alert(result.status +
" "
+ result.statusText);
}
},
statusCode: {
401:
function
(jqXHR, textStatus, errorThrown) {
self.location =
'/Account/Login/'
;
}
}
});
}