gpt4 book ai didi

javascript - Kendo UI 折线图排序顺序

转载 作者:行者123 更新时间:2023-11-30 06:29:53 25 4
gpt4 key购买 nike

我不知道如何让类别在剑道 UI 折线图中的 x 轴上正确排序。这是我的例子:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div id="chart"></div>
<script src="js/thirdParty/jquery.js"></script>
<script src="js/thirdParty/kendo.all.min.js"></script>
<script>
$(function () {
var data,
dataSource;
data = [{
type: "C1",
amount: 100,
year: 2008
}, {
type: "C2",
amount: 120,
year: 2008
}, {
type: "C2",
amount: 50,
year: 2009
}, {
type: "C1",
amount: 10,
year: 2010
}, {
type: "C1",
amount: 120,
year: 2011
}, {
type: "C2",
amount: 50,
year: 2011
}];
dataSource = new kendo.data.DataSource({
data: data,
group: {field: "type"},
sort: { field: "year" }
});
$("#chart").kendoChart({
dataSource: dataSource,
series: [{
type: "line",
field: "amount",
categoryField: "year",
name: "#= group.value #"
}],
})
});
</script>
</body>
</html>

这是输出结果的屏幕截图:

enter image description here

如您所见,即使数据是按年顺序排列的,但我已在 kendo 数据源中指定按年排序,但年份排序不正确。

如有任何帮助,我们将不胜感激。

最佳答案

您需要将年份从数字转换为日期,例如:

data = [{
type: "C1",
amount: 100,
year: new Date(2008, 0, 1);
}, {
type: "C2",
amount: 120,
year: new Date(2009, 0, 1)
}, ... // etc.

然后您甚至可以进一步定义 baseUnitStep 步骤。

关于javascript - Kendo UI 折线图排序顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18394587/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com