@univerjs-pro/sheets-pivot-chart

@univerjs-pro/sheets-pivot-chart is part of Univer Pro. It provides the Sheet-hosted data and runtime integration for Univer PivotChart.

Package Overview

| Package | UMD global | CSS | Locales | Facade entry | | --- | --- | :---: | :---: | :---: | | @univerjs-pro/sheets-pivot-chart | UniverProSheetsPivotChart | No | No | Yes |

Installation

pnpm add @univerjs-pro/sheets-pivot-chart
# or
npm install @univerjs-pro/sheets-pivot-chart

Keep all @univerjs/* and @univerjs-pro/* packages on the same version.

Usage

import { UniverSheetsPivotChartPlugin } from '@univerjs-pro/sheets-pivot-chart';

univer.registerPlugin(UniverSheetsPivotChartPlugin);

The package currently exposes the PivotChart model, commands, mutations, Worker calculation, and ChartModel binding. UI integration is provided separately.

Worker calculation

When Pivot calculation runs in a Worker, register the main-process plugin with calculation disabled. Configure the PivotTable plugin the same way:

import { UniverSheetsPivotTablePlugin } from '@univerjs-pro/sheets-pivot';
import { UniverSheetsPivotChartPlugin } from '@univerjs-pro/sheets-pivot-chart';

univer.registerPlugin(UniverSheetsPivotTablePlugin, { notExecuteFormula: true });
univer.registerPlugin(UniverSheetsPivotChartPlugin, { notExecuteFormula: true });

In the Worker, use the calculation-only plugin, alongside the existing RPC and formula Worker setup:

import { UniverSheetsPivotTablePlugin } from '@univerjs-pro/sheets-pivot';
import { UniverSheetsPivotChartWorkerPlugin } from '@univerjs-pro/sheets-pivot-chart';

univer.registerPlugin(UniverSheetsPivotTablePlugin, { notExecuteFormula: false });
univer.registerPlugin(UniverSheetsPivotChartWorkerPlugin);

The advanced Sheets presets configure this split when Worker calculation is enabled. Do not register the main-process PivotChart plugin inside the Worker: ChartModel/Drawing bindings belong to the main process. Owned field edits and filter-data requests use the calculation message bridge; undoable mutations remain coordinated by the main process. Linked field edits continue to use the referenced PivotTable commands.

Integration Notes

Creation modes

InsertPivotChartCommand accepts exactly one Pivot data source:

• sourceRangeInfo creates an independent PivotChart with a chart-owned PivotModel.
• pivotTableRef links the chart to an existing PivotTable. The chart stores only the reference and its visual configuration; the PivotTable remains the sole owner of the PivotModel and Pivot Cache report.

await commandService.executeCommand(InsertPivotChartCommand.id, {
    unitId,
    subUnitId,
    pivotTableRef: {
        unitId,
        subUnitId: pivotTableSheetId,
        pivotTableId,
    },
});

Field changes made through a linked PivotChart are delegated to the referenced PivotTable commands. Removing the chart does not remove the PivotTable. If the PivotTable is removed, the chart becomes unavailable and reconnects when the same PivotTable is restored.

Resources

• Documentation
• NPM package