JavaScript Data GridPlugin: ColumnSummary

Description
Options
- columnSummary
Methods

Description

The ColumnSummary plugin lets you easily summarize your columns.

You can use the built-in summary functions, or implement a custom summary function.

For each column summary, you can set the following configuration options:

Option	Required	Type	Default	Description
`sourceColumn`	No	Number	Same as `destinationColumn`	Selects a column to summarize
`ranges`	No	Array	-	Selects ranges of rows to summarize
`type`	Yes	String	-	Sets a summary function
`destinationRow`	Yes	Number	-	Sets the destination cell's row coordinate
`destinationColumn`	Yes	Number	-	Sets the destination cell's column coordinate
`forceNumeric`	No	Boolean	`false`	Forces the summary to treat non-numerics as numerics
`reversedRowCoords`	No	Boolean	`false`	Reverses the row coordinate, count row coordinates backward. Useful when displaying summary results at the bottom of the grid, as it allows you to reference rows relative to the last row (e.g., `destinationRow: 0` refers to the last row when this option is enabled)
`suppressDataTypeErrors`	No	Boolean	`true`	Suppresses data type errors
`readOnly`	No	Boolean	`true`	Makes summary cell read-only
`roundFloat`	No	Number/ Boolean	-	Rounds summary result
`customFunction`	No	Function	-	Lets you add a custom summary function

Example

const container = document.getElementById('example');
const hot = new Handsontable(container, {
  data: getData(),
  colHeaders: true,
  rowHeaders: true,
  columnSummary: [
    {
      type: 'min',
      destinationRow: 4,
      destinationColumn: 1,
    },
    {
      type: 'max',
      destinationRow: 0,
      destinationColumn: 3,
      reversedRowCoords: true
    },
    {
      type: 'sum',
      destinationRow: 4,
      destinationColumn: 5,
      forceNumeric: true
    }
  ]
});

Options

columnSummary

Source code

columnSummary.columnSummary : Array<object> | function

The columnSummary option configures the ColumnSummary plugin.

You can set the columnSummary option to an array of objects. Each object configures a single column summary, using the following properties:

Property	Possible values	Description
`sourceColumn`	A number	Column to summarize
`ranges`	An array	Ranges of rows to summarize
`type`	`'sum'` \| `'min'` \| `'max'` \| `'count'` \| `'average'` \| `'custom'`	Summary function
`destinationRow`	A number	Destination cell's row coordinate
`destinationColumn`	A number	Destination cell's column coordinate
`forceNumeric`	`true` \| `false`	Treat non-numerics as numerics
`reversedRowCoords`	`true` \| `false`	Reverse row coordinates
`suppressDataTypeErrors`	`true` \| `false`	Suppress data type errors
`readOnly`	`true` \| `false`	Make summary cell read-only
`roundFloat`	`true` \| `false` \| A number	Round summary result
`customFunction`	A function	Custom summary function

Default: undefined
Example

columnSummary: [
  {
    sourceColumn: 0,
    ranges: [
      [0, 2], [4], [6, 8]
    ],
    type: 'custom',
    destinationRow: 4,
    destinationColumn: 1,
    forceNumeric: true,
    reversedRowCoords: true,
    suppressDataTypeErrors: false,
    readOnly: true,
    roundFloat: false,
    customFunction(endpoint) {
       return 100;
    }
  }
],

Methods

disablePlugin

Source code

columnSummary.disablePlugin()

Disables the plugin functionality for this Handsontable instance.

enablePlugin

Source code

columnSummary.enablePlugin()

Enables the plugin functionality for this Handsontable instance.

isEnabled

Source code

columnSummary.isEnabled() ⇒ boolean

Checks if the plugin is enabled in the handsontable settings. This method is executed in Hooks#beforeInit hook and if it returns true then the ColumnSummary#enablePlugin method is called.

updatePlugin

Source code

columnSummary.updatePlugin()

Updates the plugin's state.

This method is executed when updateSettings() is invoked with any of the following configuration options:

columnSummary