如何在绑定到客户端控件之前对SAPUI5 OData进行分组? [英] How to group SAPUI5 OData before bind to control at client side?
问题描述
我有一个例如JSON表示法的odata列表:
I have an odata list for example in JSON notation:
var data = [
{"category" : "A", "value" : 1, "group" : "x"},
{"category" : "B", "value" : 2, "group" : "y"},
{"category" : "C", "value" : 3, "group" : "x"},
{"category" : "A", "value" : 4, "group" : "y"},
{"category" : "A", "value" : 5, "group" : "x"}
];
首先我过滤 group == x;
左边的值是:
First of all I filter against group == x;
Values left are:
var data = [
{"category" : "A", "value" : 1, "group" : "x"},
{"category" : "C", "value" : 3, "group" : "x"},
{"category" : "A", "value" : 5, "group" : "x"}
];
现在我将按类别分组(在客户端)并总结值,因此结果应该是be:
Now I would group (at client side) by category and sum up the values, so the result should be:
var data = [
{"category" : "A", "value" : 6, },
{"category" : "C", "value" : 3, },
];
之后我会将模型绑定到某个SAPUI5控件。
After that I would bind the model to some SAPUI5 control.
但分组部分似乎不可能。
But the grouping part seems not possible.
有人知道这个问题的通用解决方案吗?
Does someone know a generic solution for that problem?
潜在用例:
var oDataset = new sap.viz.ui5.data.FlattenedDataset({
dimensions : [ {axis : 1, value : "{category}", name : "Category" } ],
measures : [ {value : "{value}", name : "Value" } ],
data : {
path : "/Data"
}
});
var oGraph = new sap.viz.ui5.Donut({
dataset : oDataset, // sap.viz.ui5.data.Dataset
});
推荐答案
以下代码适用于我。通过通用绑定查询一些产品的Northwind Order_Details服务,map减少返回的绑定并将每个订单的数量汇总到销售的总量,在柱形图中显示结果。
The following code works for me. Query Northwind Order_Details service for a couple of Products via a generic binding, map reduce the the returned bindings and aggregate the Quantity of each order to the total Quanity sold, show the results in a column chart.
注意sap.viz引入了Array.prototype.map和Array.prototype.reduce函数
note sap.viz introduces Array.prototype.map and Array.prototype.reduce functions
var sURI = 'http://services.odata.org/Northwind/Northwind.svc/';
var oDataModel = new sap.ui.model.odata.ODataModel(sURI, true);
oDataModel.setSizeLimit(10000);
var oJSONModel = new sap.ui.model.json.JSONModel({}, 'jmodel');
// handle list of contexts
var handler = function(oEvent) {
var mapCallback = function(oContext) {
var obj = {};
obj.ProductID = oContext.getObject().ProductID,
obj.Quantity = oContext.getObject().Quantity
return obj;
};
var reduceCallback = function(aPrev, oCurr) {
var aNext = aPrev;
var bFound = false;
aNext.forEach(function(item) {
if (item.ProductID === oCurr.ProductID) {
bFound = true;
item.Quantity += oCurr.Quantity;
}
})
if (bFound === false) {
aNext.push(oCurr);
}
return aNext;
};
//release handler
oBindings.detachChange(handler);
var aTotals = oEvent.oSource.getContexts().map(mapCallback).reduce(reduceCallback, []);
oJSONModel.setData({
'Order_Totals': aTotals
});
};
// Filter all orders by 3 products
var oFilter1 = new sap.ui.model.Filter("ProductID", sap.ui.model.FilterOperator.EQ, '1');
var oFilter2 = new sap.ui.model.Filter("ProductID", sap.ui.model.FilterOperator.EQ, '68');
var oFilter3 = new sap.ui.model.Filter("ProductID", sap.ui.model.FilterOperator.EQ, '11');
var aFilter = [oFilter1, oFilter2, oFilter3];
// Sort by ProductID
var oSorter = new sap.ui.model.Sorter("ProductID", false, true);
// Reduce the returned payload by nominating need fields
var oSelect = {
select: 'ProductID,Quantity'
}
var oBindings = oDataModel.bindList("/Order_Details", null, oSorter, aFilter, oSelect);
// call OData service and handle results
oBindings.attachChange(handler);
oBindings.getContexts();
var oDataset = new sap.viz.ui5.data.FlattenedDataset({
dimensions: [{
axis: 1,
name: 'ProductID',
value: "{ProductID}"
}],
measures: [{
name: 'Quantity Sold',
value: '{Quantity}'
}],
data: {
path: "/Order_Totals"
}
});
var oColumnChart = new sap.viz.ui5.Column({
width: "80%",
height: "400px",
plotArea: {
'colorPalette': d3.scale.category20().range()
},
title: {
visible: true,
text: 'Qutantity Sold by Product'
},
dataset: oDataset
});
oColumnChart.setModel(oJSONModel);
这篇关于如何在绑定到客户端控件之前对SAPUI5 OData进行分组?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!