Aggregations (Enterprise)

apex-grid-enterprise computes per-column aggregations over your data. The same aggregations config drives grand totals via getAggregations(), per-group totals when grouping, and per-measure pivot cells when pivoting.

Requesting aggregations

Map each column key to the list of functions to compute:

import 'apex-grid-enterprise/define';

const grid = document.createElement('apex-grid-enterprise');
grid.columns = columns;
grid.data = data;

grid.aggregations = {
  price:  ['sum', 'avg', 'min', 'max'],
  sold:   ['sum', 'max'],
  rating: ['avg'],
};

Aggregation functions

AggregationFn is one of:

FunctionResult
'sum'Total of numeric values
'avg'Mean of numeric values
'min'Smallest value
'max'Largest value
'count'Number of rows

AggregationConfig is Record<columnKey, AggregationFn[]>.

Reading grand totals

getAggregations() returns an AggregationResults object of the same shape, each requested function resolved to a number:

const totals = grid.getAggregations();
// → {
//     price:  { sum: 657.92, avg: 109.65, min: 49.99, max: 189 },
//     sold:   { sum: 347, max: 91 },
//     rating: { avg: 4.12 },
//   }

AggregationResults is Record<columnKey, Partial<Record<AggregationFn, number>>>.

The grand-total row

getAggregations() gives you the numbers; grid.totalRow puts them on screen as a row. Added in enterprise 0.7.0.

grid.totalRow = {
  aggregations: { salary: ['sum', 'avg'] },
  position: 'bottom',
};
FieldTypeDescription
aggregationsAggregationConfigThe same shape as grid.aggregations. An empty config renders nothing
position'top' | 'bottom'Where the row sits. Default 'bottom'
labelstringLeading label. Defaults to the localized grand-total string

Two things distinguish it from the aggregates you already have:

  • It totals the view, not a group. Row grouping totals a group's own leaves, which answers "what does EMEA add up to". This answers "what is the sum of this column", with no grouping involved. Group header rows are excluded so their aggregates are not counted twice.
  • It follows filtering. A filtered grid totals what it shows.

null (the default) renders nothing, so the feature is inert until you ask for it. Pivot supplies its own grand total, so totalRow covers the flat and grouped views.

grid.getTotals()   // the row's computed values, keyed by column then aggregation

Per-group aggregations

When groupBy is set, each group header row shows the aggregate of its leaf rows automatically — no extra call needed. Grouping recomputes when aggregations changes:

grid.groupBy = ['region'];
grid.aggregations = { revenue: ['sum', 'avg'] };

See Row Grouping.

Per-selection aggregations

For live totals over a selected cell range, use range selection with getSelectionStats(), or drop in the status bar companion element which shows count/sum/average/min/max for the current selection with no code.

React example

import { useEffect, useRef, useState } from 'react'
import 'apex-grid-enterprise/define'

export default function AggregatedGrid() {
  const ref = useRef<any>(null)
  const [totals, setTotals] = useState<any>(null)

  useEffect(() => {
    const grid = ref.current
    grid.columns = columns
    grid.data = data
    grid.aggregations = { price: ['sum', 'avg'], sold: ['sum'] }
    setTotals(grid.getAggregations())
  }, [])

  return (
    <div>
      {totals && <p>Total revenue: {totals.price?.sum}</p>}
      <apex-grid-enterprise ref={ref} style={{ height: 480 }} />
    </div>
  )
}