Skip to content
RevoGrid [Pro]

Save and Restore Charts

Saving a chart remembers its type, selected measures, filters and appearance. A linked chart returns to the latest Pivot data; an unlinked chart contains a bounded copy of the chart dataset.

Try saving a chart, changing its type, then restoring the saved chart. Settings return to the saved state. Decide whether the restored chart should follow live report changes or keep its captured data.

Interactive example

Save and restore a chart

Keep a standalone chart’s settings and data in this example’s memory.

Try it: Save this chart, change it, then restore it.

The example loads when visible.

What to notice: Your saved chart type, appearance and data return. Reset clears the saved copy.

This example uses session-local memory. Your application chooses durable storage, user permissions and when to save. See Pivot saved reports when you also need the table layout.

Save one chart

Section titled “Save one chart”

For the chart created in Getting Started, save its model as JSON, then restore it into the same emptied container:

import { PivotChartsPlugin } from '@revolist/pivot';
import { grid, chart } from './first-pivot';


const charts = (await grid.getPlugins()).find(
  (plugin): plugin is PivotChartsPlugin => plugin instanceof PivotChartsPlugin,
)!;
const savedJson = JSON.stringify(chart.model);
const container = chart.container;
chart.destroy();
const restoredChart = await charts.restoreChart(JSON.parse(savedJson), { container });
// Later: restoredChart.destroy();

chart.model returns a copy of the saved settings. Store the JSON in your application’s chosen storage. A linked model needs its Pivot report available when restored. To capture chart values as well, first call await chart.update({ linked: false }); see linked and unlinked data.

Model and persistence

Section titled “Model and persistence”
Interactive example

Inspect a saved chart model

Save the standalone chart as JSON and restore the exact saved model.

Try it: Save the model, change the chart, then restore the model.

The example loads when visible.

What to notice: The saved JSON includes standalone source data as well as chart settings.

This advanced example exposes the JSON model and link-state behavior. The first example on this page is the shorter save/change/restore workflow.

PivotChartModel version 2 contains:

  • stable chartId and chartType;
  • link state and an optional unlinked dataset snapshot;
  • totals, series selection, values-on-rows measure, and semantic bindings;
  • presentation, renderer theme, and validated chart options;
  • authored axes, per-series overrides, interaction mode, and semantic selection;
  • navigation controls and the authored category/time viewport;
  • the authored chart-local query, including its slice, filters, sort, and ranking;
  • breadcrumb/drill scope and drill synchronization mode.
const saved = charts.getChartModels();
localStorage.setItem('pivot-charts', JSON.stringify(saved));


const restoredModels = JSON.parse(
  localStorage.getItem('pivot-charts') ?? '[]',
);


for (const model of restoredModels) {
  await charts.restoreChart(model, {
    container: createWorkspacePanel(model.chartId),
  });
}

Restore parses the current model version, checks chart identity, renderer support, options, bindings, selected series, hierarchy paths, dataset shape, limits, and linked/unlinked rules. Optional model.limits contains the authored partial budget overrides and survives JSON save/restore. Missing limits in an existing version 2 model inherit plugin configuration. Restoring captured data validates it against the effective budget before renderer creation. Older model versions are rejected rather than implicitly migrated. Supply chartId in PivotChartRestoreOptions only when the application intentionally replaces the persisted identity.

Common mistakes

Section titled “Common mistakes”
  • Saving settings does not store the full source orders. A linked chart needs its source report available when restored.
  • Do not restore a second chart with an already-active saved ID. Destroy the old instance or intentionally choose a new restore ID.
  • Runtime containers, renderers and formatter functions are application bindings, not JSON. Supply them again when rebuilding the workspace.

Next steps

Section titled “Next steps”

See chart link state, exports and lifecycle cleanup.