Search results

Internationalization in JavaScript (ES5) Maps control

23 Feb 2021 / 1 minute to read

Maps provides support for internationalization for the below elements.

  • Datalabel
  • Tooltip

For more information about number and date formatter you can refer internationalization.


Globalization is the process of designing and developing an component that works in different cultures/locales. Internationalization library is used to globalize number, date, time values in Maps component using [format] property in the maps model.

Numeric Format

In the below example tooltip is globalized to Deutsch culture.

import { Maps } from '@syncfusion/ej2-maps';
import { world_map } from './world-map.ts';
import { setCulture } from '@syncfusion/ej2-base';
let maps: Maps = new Maps({
    format: 'c',
    layers: [
            shapeData: world_map,
            dataSource: [{  "Country": "China", "Membership": "Permanent"},
            {"Country": "France","Membership": "Permanent" },
            { "Country": "Russia","Membership": "Permanent"},
            {"Country": "Kazakhstan","Membership": "Non-Permanent"},
            { "Country": "Poland","Membership": "Non-Permanent"},
            {"Country": "Sweden","Membership": "Non-Permanent"}],
            shapePropertyPath: 'name',
            shapeDataPath: 'Country'
            shapeSettings: {
                colorValuePath: 'Membership',
                colorMapping: [
                    value: 'Permanent', color: '#D84444'
                    value: 'Non-Permanent', color: '#316DB5'