gpt4 book ai didi

datasource - Kendo UI 条形图数据分组

转载 作者:行者123 更新时间:2023-12-04 21:20:04 25 4
gpt4 key购买 nike

不确定这是否可能。在我的示例中,我使用 json 作为源,但这可以是任何大小。在我的示例中 fiddle我将通过仅绑定(bind)两列 ProductFamily (xAxis) 和 Value (yAxis) 以共享方式使用这些数据,但我希望能够通过使用聚合对列进行分组。

在这个没有分组的例子中,它显示了 FamilyA 的多个列。 可以将其分组到一列中,并且无论数据量如何都可以汇总值?

所以结果将显示一列 FamilyA 的值 4850 + 4860 = 9710 等?

在线所有示例的一个问题是每个类别始终存在正确的数据量。不确定这是否有意义?

http://jsfiddle.net/jqIndy/ZPUr4/3/

//Sample data (see fiddle for complete sample)
[{
"Client":"",
"Date":"2011-06-01",
"ProductNumber":"5K190",
"ProductName":"CABLE USB",
"ProductFamily":"FamilyC",
"Status":"OPEN",
"Units":5000,
"Value":5150.0,
"ShippedToDestination":"CHINA"
}]


var productDataSource = new kendo.data.DataSource({
data: dr,
//group: {
// field: "ProductFamily",
//},
sort: {
field: "ProductFamily",
dir: "asc"
},
//aggregate: [
// { field: "Value", aggregate: "sum" }
//],
//schema: {
// model: {
// fields: {
// ProductFamily: { type: "string" },
// Value: { type: "number" },
// }
// }
//}
})

$("#product-family-chart").kendoChart({
dataSource: productDataSource,
//autoBind: false,
title: {
text: "Product Family (past 12 months)"
},
seriesDefaults: {
overlay: {
gradient: "none"
},
markers: {
visible: false
},
majorTickSize: 0,
opacity: .8
},
series: [{
type: "column",
field: "Value"
}],
valueAxis: {
line: {
visible: false
},
labels: {
format: "${0}",
skip: 2,
step: 2,
color: "#727f8e"
}
},
categoryAxis: {
field: "ProductFamily"
},
legend: {
visible: false
},
tooltip: {
visible: true,
format: "Value: ${0:N0}"
}
});​

最佳答案

Kendo UI 图表不支持绑定(bind)到组聚合。至少现在还没有。

我的建议是:

  • 移动聚合定义,因此它是按组计算的:
    group: {
    field: "ProductFamily",
    aggregates: [ {
    field: "Value",
    aggregate: "sum"
    }]
    }
  • 在更改处理程序中提取聚合值:
    var view = products.view();
    var families = $.map(view, function(v) {
    return v.value;
    });
    var values = $.map(view, function(v) {
    return v.aggregates.Value.sum;
    });
  • 手动绑定(bind)组和类别:
    series: [ {
    type: "column",
    data: values
    }],
    categoryAxis: {
    categories: families
    }

  • 工作演示可以在这里找到: http://jsbin.com/ofuduy/5/edit

    我希望这有帮助。

    关于datasource - Kendo UI 条形图数据分组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13622402/

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