我正在尝试使用数据透视表来表示以下数据,
$.pivotUtilities.tipsData=[
{status:"open",year:2014,value:100.00},
{status:"open",year:2015,value:200.00},
{status:"open",year:2016,value:300.00},
{status:"approved",year:2016,value:10.00},
{status:"approved",year:2015,value:20.00},
{status:"approved",year:2014,value:30.00},
{status:"closed",year:2016,value:3.00},
{status:"closed",year:2014,value:3.00},
{status:"closed",year:2013,value:-10.00}
]
var utils = $.pivotUtilities;
$("#output").pivot(
utils.tipsData, {
rows: ["status"],
cols: ["year"],
vals: ["value"]
});
我得到以下结果
任何人都可以帮我这么做吗?
答案 0 :(得分:0)
由于这是有角度的,所以你需要做的就是将控制器中的数据映射到新结构并将其传递给view来完成这个相当简单的表
$scope.pivotFields = ['open', 'approved', 'closed'];
$scope.pivotData = {};
angular.forEach(data, function(item) {
if (!$scope.pivotData[item.year]) {
$scope.pivotData[item.year] = {open: 0, approved: 0, closed: 0}
}
$scope.pivotData[item.year][item.status] += item.value;
});
$scope.years = Object.keys($scope.pivotData).sort(function(a,b){
return b-a;
});
查看:
<table class="table">
<tr>
<th>Status</th>
<th ng-repeat="yr in years">{{yr}}</th>
</tr>
<tr ng-repeat="field in pivotFields">
<td>{{field}}</td>
<td ng-repeat="yr in years">{{pivotData[yr][field]}}</td>
</tr>
</table>
的 DEMO 强>
答案 1 :(得分:0)
我使用了以下代码
$("#output").pivotUI(financial, {
rows: ["requeststateName"],
cols: ["fiscalyearValue"],
aggregatorName: "Integer Sum",
vals: ["amountrequested"],
rendererName: "Heatmap"
});