When using pivot, you can also use
groupSummaryReducer which is very useful to compute a summary for all records in a pivoted group - the
reducer function specified by
groupSummaryReducer is basically called for every item in the pivoted group, while an optional
complete function is called at the end of the summary, thus giving you the flexibility to compute things like average values (where you actually need access to the full array of the grouped items).
Although we don't have an explicit property in the dataset for quarter info, it's a derived information which can be computed based on the date property.
As a result, by specifying a
column.groupSummaryReducer prop, we make quarter columns participate in the pivoting grid with useful information.
In a pivoted grid, the default render value for a column with a group summary reducer is the value computed by
column.groupSummaryReducer. In addition, like shown in the example below, it can be formatted via the column render function.
In order to be able to display pivot summary columns, the corresponding pivot field needs to be an object with a
name and a
summaryReducer - the
summaryReducerfunction will compute the value to be displayed in the column (and follows the same patterns as the
groupSummaryReducer, which you are already used to).
Beyond that, you can also have a
pivot.summaryColumn specified for the pivot item, which should be a column configuration and determines how the corresponding pivot summary column will behave.
If you don't need a summary column for a pivot field, you can simply specify the pivot as a
string or an object with
{name: <pivot_field>} (without a
groupSummaryReducer)
The example above also uses
footer in order to display the sum of all values in the corresponding column.
Since some of the columns (like the pivot summary columns) are generated, we specify
footerRow.render as a function, which has access to the currently rendered
column. Based on properties of the column, we know if it's the group column (
column.groupColumn === true), the pivot grand summary column (
column.pivotGrandSummaryColumn === true), another pivot summary column (
column.pivotSummaryPath is an array) or a normal pivoted column, where
column.pivotColumnPath is an array of the pivot path for the corresponding column (eg:
['2013','q2']). In this case, we use the
summary passed into the footer render function, in order to display the correct value for the footer cell.