如何解决Chrome中不正确的分组条形图? [英] How to solve incorrect grouped bar chart in Chrome?
本文介绍了如何解决Chrome中不正确的分组条形图?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在创建像这样的分组条形图:
I'm creating a grouped bar chart like this:
$("#chart").kendoChart({
dataSource: {
data: rawdata,
group: { field: "Serie" },
},
legend: {
position: "top"
},
plotArea: {
background: "white",
},
seriesDefaults: {
type: "column",
style: "smooth",
stack: true
},
series: [
{
field: 'Valor1',
labels: {
visible: true,
background: '',
format: 'p1',
color: 'white',
position: 'center'
},
}
],
valueAxis: {
max: 1,
labels: {
format: "p2"
},
line: {
visible: false
},
axisCrossingValue: -10,
},
categoryAxis: {
field: "Segmento",
majorGridLines: {
visible: false
}
},
tooltip: {
visible: true,
template: "#= series.name # <br /> " +
"Valor = #= kendo.format('{0:p2}', value) # <br/> " +
"Tooltip = #= dataItem.Tooltip # ",
}
});
我的数据具有四个属性:Serie,Segmento,Valor1,Tooltip.一个数据点的示例:
My data has four properties: Serie, Segmento, Valor1, Tooltip. Example of one data point:
{
"Serie": "S1",
"Segmento": "C1",
"Valor1": 0.31500380634422465,
"Tooltip": 20,
}
在chrome中,堆栈条的值不正确,但在Firefox中是正确的.
The values of the stack bar are incorrect in chrome but in firefox and ie it's fine.
在Firefox中更正图形,即: chrome中的图形不正确:
Correct graph in firefox and ie: Incorrect graph in chrome:
这是一个实时演示: http://trykendoui.telerik.com/anET/9
我该如何解决?
推荐答案
这是Chrome的Array.sort
实现的问题;请参见此讨论一个>.
您可以通过对数据源进行显式排序来解决此问题:
This is a problem with Chrome's implementation of Array.sort
; see this discussion.
You can fix it by sorting the data source explicitly:
dataSource: {
data: rawdata,
group: { field: "Serie" },
sort: [{ field: "Serie", dir: "asc"}, { field: "Segmento", dir: "asc"} ]
},
这篇关于如何解决Chrome中不正确的分组条形图?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文