Skip to content

Translate Labels and Format Numbers

Localization has three parts: your data labels, the Pivot interface labels, and how values are formatted. Configure each part explicitly.

Interactive example

Translate the report controls

Translate the field-panel shelf labels without changing the source orders.

Try it: Choose French labels, then English labels.

The example loads when visible.

What to notice: Shelf labels change language while field names and the $1,000 sales total stay the same.

Compare the French field-panel labels with the report values. Interface text can change language while field identities and calculated amounts stay the same.

import type { PivotConfig } from '@revolist/pivot';
const config: Partial<PivotConfig> = {
rows: ['region'], columns: ['quarter'],
values: [{ prop: 'sales', aggregator: 'sum' }],
i18n: {
rows: 'Lignes',
aggregationNames: { sum: 'Somme', avg: 'Moyenne' },
},
};

Overrides can be partial; missing control labels retain the built-in English defaults. aggregationNames changes the displayed name, not the operation ID used in code. See the configurator localization example.

Set friendly labels in dimensions[].name. The source property sales can remain stable while its displayed name changes. Row/column member labels and saved-view names come from your application and are not automatically translated.

import type { PivotConfig } from '@revolist/pivot';
const values: PivotConfig['values'] = [{
prop: 'sales', aggregator: 'sum',
format: { preset: 'currency', currency: 'EUR', locale: 'fr-FR' },
}];

This changes the display, not the underlying amount. For percentages, configure the calculation as well as the format.

fieldPanel.texts overrides the root interface text in the stock mounts. See the field panel for its control-specific settings. Function-valued messages stay in runtime code; portable reports need explicit bindings for callbacks.

Value and conditional formatting, field labels, and chart controls and localization.