Web SDK

Gráficos dinámicos

Registra las dependencias de tablas dinámicas y gráficos, y después estos dos plugins antes de crear el libro. Combina la traducción UI en locales y carga el CSS. Se requiere una licencia Pro.

Shell
pnpm add @univerjs-pro/sheets-pivot-chart @univerjs-pro/sheets-pivot-chart-ui
TypeScript
import { UniverSheetsPivotChartPlugin } from '@univerjs-pro/sheets-pivot-chart'import { UniverSheetsPivotChartUIPlugin } from '@univerjs-pro/sheets-pivot-chart-ui'import SheetsPivotChartLocale from '@univerjs-pro/sheets-pivot-chart-ui/locale/es-ES'import { LocaleType } from '@univerjs/core'import '@univerjs-pro/sheets-pivot-chart/facade'import '@univerjs-pro/sheets-pivot-chart-ui/lib/index.css'univerAPI.loadLocales(LocaleType.ES_ES, SheetsPivotChartLocale)univer.registerPlugin(UniverSheetsPivotChartPlugin)univer.registerPlugin(UniverSheetsPivotChartUIPlugin)

El preset Sheets Advanced ya incluye ambos plugins. Úsalo con Core y Drawing e importa explícitamente @univerjs-pro/sheets-pivot-chart/facade para estas API.

Informe independiente

El gráfico es propietario del informe. Añade un campo de filas y otro de valores después de insertarlo; el ejemplo usa las dos primeras columnas.

TypeScript
const workbook = univerAPI.getActiveWorkbook()const sheet = workbook?.getActiveSheet()if (!sheet) throw new Error('No active worksheet')sheet.getRange('A1:B4').setValues([  ['Region', 'Sales'], ['East', 100], ['West', 200], ['East', 50],])const chart = await sheet.insertPivotChart(  sheet.newPivotChart(univerAPI.Enum.ChartTypeString.Column)    .setSource('A1:B4').setPosition('D2').setSize(640, 360).build(),)const fields = chart.getSourceFieldsInfo()await chart.addField(fields[0].id, univerAPI.Enum.PivotTableFiledAreaEnum.Row, 0)await chart.addField(fields[1].id, univerAPI.Enum.PivotTableFiledAreaEnum.Value, 0)

Vincular una tabla dinámica

Los campos, filtros, ordenación y contracción se comparten con la tabla referenciada y sus otros gráficos vinculados. La apariencia y posición son independientes. Eliminar el gráfico conserva la tabla. Eliminar la tabla deja el gráfico sin datos disponibles hasta restaurar la misma tabla.

TypeScript
const pivotTable = workbook.getPivotTableById('pivot-table-1')if (!pivotTable) throw new Error('PivotTable not found')const linkedChart = await sheet.insertPivotChart(  pivotTable.newChart(univerAPI.Enum.ChartTypeString.Line).setPosition('D22').build(),)linkedChart.setFieldButtonsVisible(true).setExpandCollapseButtonsVisible(true)

Tipos y Worker

Se admiten líneas, columnas, barras, áreas, sectores, anillos y combinaciones, incluidas las variantes apiladas disponibles. No se admiten dispersión, burbujas, radar ni cascadas. Los sectores usan la primera serie de valores; los anillos conservan varias. Los subtotales y totales no son categorías.

Con un Worker, utiliza UniverSheetsAdvancedPreset({ useWorker: true }) en el hilo principal y UniverSheetsAdvancedWorkerPreset() en el Worker. Consulta la configuración y FSheetPivotChart.

Copiar y eliminar hojas

Al copiar una hoja también se copian sus gráficos dinámicos con nuevos ID. Un informe independiente cuya fuente está en esa hoja usa la nueva hoja y una caché independiente. Un gráfico vinculado apunta a la tabla dinámica copiada junto con la hoja; las referencias a otras hojas no cambian. Eliminar la hoja retira sus gráficos y recursos asociados; deshacer restaura sus definiciones y datos de origen.

¿Cómo es esta guía?

© 2026 DreamNum Co., Ltd.