angular-pivottable

Angular wrapper for Nicolas Kruchten's Pivot Table.

Kruchten's

Usage :

• If you use bower, just bower install angular-pivottable. If not, download files from the github repo.

• If you use npm, just npm i angular-pivot. If not, download files from the github repo.

• Download also it's dependencies https://github.com/nicolaskruchten/pivottable, jquery & jquery-ui

• Add jquery.js, jquery-ui.js, angular-pivot.js, pivot.css, and pivot.js to your code:

  <link href="https://github.com/ErickRuano/angular-pivot/blob/master/pivot.css" rel="stylesheet" type="text/css" />
  <script src="https://github.com/ErickRuano/angular-pivot/raw/master/jquery.js"></script>
  <script src="https://github.com/ErickRuano/angular-pivot/raw/master/pivot.js"></script>
  <script src="https://github.com/ErickRuano/angular-pivot/raw/master/angular-pivot.js"></script>

• Add the angular-pivottable module as a dependency to your application module:

  angular.module('MyApp', ['angular-pivottable']);

• Add a ng-pivot attribute to any element with the name of a $scope variable containing the array of data to display on the Pivot Table.

  <div ng-pivot="data"></div>

  • You can also add a ng-pivot-options attribute to any element with the name of a $scope variable containing the options object to configure the Pivot Table.

    <div ng-pivot="data" ng-pivot-options="options"></div>

$scope.data = [
    {color: "blue", shape: "circle"},
    {color: "red", shape: "triangle"}
];

$scope.options = {
    rows: ["color"],
    cols: ["shape"]
};