javascript pivot grid with running totals of pivot grouped columns

In a way, pivoting is just an extension of row grouping, it generates new colModel by transposing row cell values into new columns.

That colModel is customizable, but first it's important and instructive to understand the structure of colModel.

Pivot total columns

Just like grouped rows summary, grouped pivot columns can be summarized by adding total columns at every level.

Total columns have type == "aggr" so they can be identified in the colModel.

Number of total columns at any level is same as the number of aggregate columns, i.e., there is one total column corresponding to Freight in this example.

Location and visibility upon expansion of parent columns of pivot total columns can be configured with groupModel.pivotColsTotal

Structure of colModel with totals

Following is the structure of pivot total columns displayed for every level of pivoted grouped columns.

  1.   The topmost pivot grouped total displays grand total of all years and blank values.
    It has dataIndx aggr_Freight where Freight is dataIndx of aggregate column.

  2.   Next level displays total of all quarters in the parent year.
    It has dataIndx 1996_aggr_Freight where 1996 is value of parent year and Freight is dataIndx of aggregate column.
    It is displayed under year 1996.

  3.   Next level displays total of all months in the parent quarter and grand parent year.
    It has dataIndx 1996_2_aggr_Freight where 1996 is value of grand parent year and 2 is value of parent quarter (Q3) and Freight is dataIndx of aggregate column.
    It can be seen under quarter Q3 after expanding year 1996.

Lowermost data bound columns

  Lowermost pivot column header cells have dataIndx in the format 1996_2_7_Freight where 7 is value of its immediate parent.
It can be seen under month of July ( whose value is 7 ) after expanding year 1996 and quarter Q3.