Question

我正在尝试使用数据透视表来表示以下数据，

$.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"]
      });

我得到以下结果

但我需要表示每个状态的值而不是值的数量，例如此图像

任何人都可以帮我这么做吗？

Answer 1

由于这是有角度的，所以你需要做的就是将控制器中的数据映射到新结构并将其传递给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

Answer 2

我使用了以下代码

$("#output").pivotUI(financial, {
            rows: ["requeststateName"],
            cols: ["fiscalyearValue"],
            aggregatorName: "Integer Sum",
            vals: ["amountrequested"],
            rendererName: "Heatmap"
        });

使用数据透视表表示对象数据的数组

2 个答案: