www.wikipedia.org
Feel free to share demo-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Backend API
import React from 'react';
import VectorMap, {
Layer,
Export,
Title,
Label, ILayerProps,
} from 'devextreme-react/vector-map';
import { pangaeaBorders, pangaeaContinents } from './data.ts';
const projection = {
to: ([l, lt]) => [l / 100, lt / 100],
from: ([x, y]) => [x * 100, y * 100],
};
const customizeLayer: ILayerProps['customize'] = (elements) => {
elements.forEach((element) => {
element.applySettings({
color: element.attribute('color'),
});
});
};
export default function App() {
return (
<VectorMap
id="vector-map"
maxZoomFactor={2}
projection={projection}
>
<Title text="Map of Pangaea" subtitle="with modern continental outlines"></Title>
<Layer
dataSource={pangaeaBorders}
hoverEnabled={false}
name="pangaea"
color="#bb7862">
</Layer>
<Layer
dataSource={pangaeaContinents}
customize={customizeLayer}>
<Label enabled={true} dataField="name"></Label>
</Layer>
<Export enabled={true}></Export>
</VectorMap>
);
}
import React from 'react';
import VectorMap, {
Layer, Export, Title, Label,
} from 'devextreme-react/vector-map';
import { pangaeaBorders, pangaeaContinents } from './data.js';
const projection = {
to: ([l, lt]) => [l / 100, lt / 100],
from: ([x, y]) => [x * 100, y * 100],
};
const customizeLayer = (elements) => {
elements.forEach((element) => {
element.applySettings({
color: element.attribute('color'),
});
});
};
export default function App() {
return (
<VectorMap
id="vector-map"
maxZoomFactor={2}
projection={projection}
>
<Title
text="Map of Pangaea"
subtitle="with modern continental outlines"
></Title>
<Layer
dataSource={pangaeaBorders}
hoverEnabled={false}
name="pangaea"
color="#bb7862"
></Layer>
<Layer
dataSource={pangaeaContinents}
customize={customizeLayer}
>
<Label
enabled={true}
dataField="name"
></Label>
</Layer>
<Export enabled={true}></Export>
</VectorMap>
);
}
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.tsx';
ReactDOM.render(
<App />,
document.getElementById('app'),
);
/* eslint-disable max-len */
export const pangaeaBorders = {
type: 'FeatureCollection',
features: [{
type: 'Feature',
properties: {
name: 'Pangaea',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-28, 86.33], [-28, 88], [-27.33, 89.67], [-25.67, 91.67], [-21.33, 93.67], [-15, 95.67], [-7.67, 98.67], [-4.67, 99.33], [-1, 99.33], [4.67, 99], [9.33, 97.33], [13.33, 96], [19, 96], [25.33, 95], [29.33, 93], [34.67, 91.67], [41.67, 89.33], [45.33, 88.67], [48.67, 85.67], [52, 82.33], [55.67, 79.67], [60.67, 75.67], [64, 71.67], [64.67, 70.67], [65.67, 68.33], [66.33, 67.33], [67, 66.33], [69, 65], [72, 63.33], [75.33, 61], [78.33, 58.33], [80.33, 56], [81.67, 53], [84, 50], [84.67, 48], [84.67, 46.67], [82.33, 47.67], [81, 48.33], [80.33, 48.33], [79.67, 47.67], [80.33, 45], [82.33, 43.33], [85, 40.67], [87.33, 38.67], [90, 36.67], [92, 35.67], [92, 36.33], [91, 38], [90, 39.67], [93.33, 40], [96.67, 39.67], [97.67, 39], [98.67, 37.67], [99.33, 36.33], [102, 25], [101.67, 23], [99.33, 22], [96.33, 22.67], [93.33, 25], [92, 27], [90.33, 28], [89.33, 30.33], [89.33, 32], [90.33, 32.67], [91.33, 33.33], [89, 35], [84.33, 38], [81.67, 40], [79.33, 41.67], [77.67, 43.33], [75.67, 45], [74, 46.67], [72.67, 49], [70.67, 50], [67.67, 50.67], [64.67, 50.67], [62, 50.33], [59.67, 49.33], [56.67, 46.33], [54.33, 44], [54.33, 41.33], [51.67, 38], [50, 35.67], [48.33, 33.67], [48.33, 32.33], [42.33, 31.33], [37.67, 31.67], [35.67, 32], [30.33, 31], [26.33, 30.33], [22, 31.67], [17, 33.33], [13, 32.67], [11.67, 32], [10, 30], [8, 26.67], [8, 23], [8, 20], [8.67, 19.33], [9.33, 18], [9.33, 15.33], [11.33, 12.67], [12.67, 10.67], [15.33, 8.67], [19, 6], [24, 4.67], [26, 4.67], [37.67, 4.33], [40.67, 1.67], [40.67, 0.33], [40.33, -1.33], [40.67, -3], [41.67, -4.33], [41.67, -5.33], [40.33, -6.67], [39, -9.33], [38, -10.67], [37.33, -14], [38.67, -17], [42.33, -18.67], [44.33, -19], [47, -19], [48.67, -18.67], [50.33, -19.67], [50.33, -21], [48, -21.33], [47, -22.67], [46, -24.33], [45, -26.33], [46.33, -26.67], [49, -27.67], [51, -28], [53.33, -30.33], [54.33, -33.67], [55, -34.67], [53.67, -36.33], [52, -40.33], [51.33, -42.33], [52, -43.67], [54, -45.33], [54.33, -46], [54.67, -47.33], [55, -48.67], [57.33, -50], [60, -51.33], [62, -52.33], [64.33, -53.67], [64.67, -54], [65.33, -55.67], [66.67, -57.33], [68, -58.33], [69.33, -58], [71, -57.67], [71.67, -59.67], [72.67, -62], [73, -64.33], [73, -66.33], [72.33, -68.67], [71.67, -70], [71, -71.33], [71.67, -73.67], [72.67, -75], [72.67, -77], [71.33, -80], [68.67, -81.67], [65.67, -84.67], [64.33, -85.67], [60.67, -88], [58, -89.67], [55.67, -91], [52.33, -92], [49, -92.67], [47.67, -93.67], [46, -94.67], [44, -96], [39, -96.67], [37.33, -96.67], [34.67, -97], [32, -97.67], [32.33, -98.67], [28.67, -99.67], [23.67, -99.33], [21.67, -99.33], [22.33, -97.33], [22, -96.33], [21, -95.67], [19.67, -95.33], [18.67, -94.67], [17.67, -94], [18.67, -92.67], [19.67, -91], [19.67, -89.67], [19.67, -87.67], [15, -89.33], [12.33, -89.33], [9, -88.67], [4.33, -86.67], [-0.67, -85], [-4, -83.67], [-3.67, -82], [-2, -78.33], [-4.33, -78.33], [-7.33, -75.33], [-8.67, -74], [-11, -73], [-13, -73.33], [-15, -73.33], [-17.33, -74.67], [-15.67, -76.67], [-14.67, -77.33], [-14.67, -78.33], [-16.33, -79], [-18.67, -80], [-20.33, -79.67], [-26, -73], [-33, -66.67], [-33.33, -61.67], [-33.33, -57.33], [-33.33, -55], [-33.67, -52.67], [-35, -50.67], [-37.33, -48.33], [-39.67, -46.67], [-42.33, -45], [-43, -44.67], [-45, -44], [-46.33, -42.33], [-46.67, -41.67], [-49, -41], [-50.33, -41], [-51.67, -40.67], [-52, -39], [-52.33, -38], [-52.67, -37.33], [-53.33, -36.67], [-54.67, -36], [-56.33, -36], [-57, -35.67], [-57.67, -34.67], [-57.67, -33.33], [-57, -31.67], [-56.67, -29.67], [-56.33, -29.33], [-56.67, -27.33], [-57.33, -25.67], [-57.67, -24.33], [-56.33, -23.67], [-55.33, -23], [-55, -21.67], [-55.67, -19.33], [-57, -18.33], [-60.33, -18.33], [-62.33, -17], [-63.33, -16.33], [-62, -15], [-58.67, -15.33], [-56.33, -15], [-53.33, -13.67], [-51.67, -11.33], [-51.33, -10.67], [-52, -8.33], [-53.33, -5.33], [-55.67, -3.67], [-58.33, -2.67], [-59.67, -2.67], [-60.67, -1.67], [-61, 0], [-60.33, 0.67], [-59.33, 3], [-59.33, 4.33], [-59.33, 6.33], [-60.33, 10], [-62, 12], [-63.67, 14], [-64, 15], [-63, 18.67], [-61.67, 21.67], [-60, 25.67], [-57.33, 32], [-55.67, 35.67], [-55, 38.33], [-54, 42], [-54.33, 44], [-54.33, 45], [-54, 46.33], [-53.67, 47.67], [-55, 48.67], [-57, 49.67], [-59.33, 50], [-61.33, 51], [-62.67, 51.33], [-63.33, 52.33], [-61.67, 54], [-61.67, 56.67], [-60, 58], [-57.33, 60], [-55.67, 61.67], [-52, 61.67], [-50.33, 63.67], [-45.67, 63], [-42.67, 62.67], [-40.67, 62.33], [-39.33, 64], [-37.67, 66], [-36.67, 67], [-35, 67.33], [-32, 67], [-30.33, 66], [-27.67, 64], [-25.33, 63.33], [-23.33, 63.67], [-21.33, 64], [-19.33, 64.33], [-17, 63.67], [-14.67, 62.33], [-12.33, 61], [-9.33, 61], [-8.33, 63.67], [-9, 67], [-10.33, 70.33], [-14, 73], [-15.33, 73], [-16.67, 74], [-17, 76], [-18.67, 78.33], [-20.67, 79], [-22.67, 79], [-25.67, 79], [-28.67, 78], [-30.33, 77], [-31.67, 76], [-33.33, 77], [-34.67, 79.67], [-34, 81], [-32.67, 82], [-32, 83.67], [-32.67, 85.67], [-32.67, 86.67], [-31, 87], [-28.33, 86.67],
],
],
},
}],
};
export const pangaeaContinents = {
type: 'FeatureCollection',
features: [{
type: 'Feature',
properties: {
name: 'Eurasia',
color: '#70b3a1',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-28.33, 86.67], [-27.33, 85], [-26.33, 84.33], [-24.33, 83.67], [-22.67, 84], [-21.33, 85], [-20.33, 86.33], [-18.33, 86.33], [-15.67, 86.33], [-13, 86.67], [-10.33, 86.67], [-7, 86.33], [-3.67, 86.67], [-2, 87.67], [-0.67, 88.67], [-2, 88.67], [-3.33, 89], [-5.67, 90.33], [-7, 91.33], [-5.67, 92.33], [-2, 93.33], [2, 93.33], [7.67, 92.67], [10.67, 92.67], [16.33, 92], [20.33, 92], [24.67, 92], [26.67, 92], [27.67, 91.33], [28, 90.33], [27, 89.33], [26.67, 88], [27.33, 86.67], [29, 85.67], [37.33, 85.67], [38.67, 84.33], [41.33, 83], [42, 84.33], [43.33, 84.33], [47.33, 82], [50.67, 80.33], [55.67, 79.67], [60.67, 75.67], [64, 71.67], [64.67, 70.67], [65.67, 68.33], [66.33, 67.33], [67, 66.33], [69, 65], [72, 63.33], [75.33, 61], [78.33, 58.33], [80.33, 56], [81.67, 53], [84, 50], [84.67, 48], [84.67, 46.67], [82.33, 47.67], [81, 48.33], [80.33, 48.33], [79.67, 47.67], [80.33, 45], [82.33, 43.33], [85, 40.67], [87.33, 38.67], [90, 36.67], [92, 35.67], [92, 36.33], [91, 38], [90, 39.67], [93.33, 40], [96.67, 39.67], [97.67, 39], [98.67, 37.67], [99.33, 36.33], [102, 25], [101.67, 23], [99.33, 22], [96.33, 22.67], [93.33, 25], [92, 27], [90.33, 28], [89.33, 30.33], [89.33, 32], [90.33, 32.67], [91.33, 33.33], [89, 35], [84.33, 38], [81.67, 40], [79.33, 41.67], [77.67, 43.33], [75.67, 45], [74, 46.67], [72.67, 49], [70.67, 50], [67.67, 50.67], [64.67, 50.67], [62, 50.33], [59.67, 49.33], [56.67, 46.33], [54.33, 44], [54.33, 41.33], [51.67, 38], [50, 35.67], [48.33, 33.67], [48.33, 32.33], [42.33, 31.33], [37.67, 31.67], [35.67, 32], [30.33, 31], [26.33, 30.33], [22, 31.67], [17, 33.33], [13, 33], [13.67, 34.67], [15, 37.67], [15.33, 40], [14.33, 41.33], [11.67, 41.67], [8.67, 43.33], [8, 45], [6, 44.67], [6.67, 41.67], [7.67, 39.33], [8.33, 35.67], [9, 32.33], [9.33, 29.67], [7.67, 32.67], [6, 34.67], [3.67, 36], [2.33, 36.33], [1.67, 37.33], [1.67, 39], [2.33, 40.33], [2.33, 42.67], [2, 44.67], [2, 46.33], [2, 47.33], [3, 48.33], [4, 49.33], [6.33, 49.33], [7.67, 49.67], [9, 50], [8.67, 49], [8.67, 47.67], [10.67, 47.67], [13, 47.67], [15.33, 48.33], [17, 49.33], [14, 50.67], [12.33, 51.67], [12, 52.33], [12, 54], [12, 55.33], [9, 55.33], [6.33, 56], [4, 56.67], [2.33, 57.67], [3, 58.67], [2.67, 60.67], [4.67, 59.33], [6, 58.33], [7.67, 57.33], [9.67, 56.33], [11.67, 56.33], [12, 57.33], [11.67, 58.67], [11.67, 59.67], [12.67, 60], [14.33, 61], [13.33, 62.67], [11.67, 63.33], [10.33, 63.33], [7.67, 63.67], [7.67, 65], [6, 66], [3, 67], [-0.33, 67.67], [-2.33, 67.67], [-5, 68.67], [-3.67, 69.67], [-0.67, 71.33], [-0.67, 73], [-2.33, 74], [-4.67, 75], [-5.33, 75.33], [-5.67, 77], [-6.33, 78], [-8.67, 78], [-11.33, 77.33], [-17, 76], [-18.67, 78.33], [-20.67, 79], [-22.67, 79], [-25.67, 79], [-28.67, 78], [-30.33, 77], [-31.67, 76], [-33.33, 77], [-34.67, 79.67], [-34, 81], [-32.67, 82], [-32, 83.67], [-32.67, 85.67], [-32.67, 86.67], [-31, 87], [-28.33, 86.67],
],
],
},
}, {
type: 'Feature',
properties: {
name: 'Australia',
color: '#bb626a',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[64.67, -54], [65.33, -55.67], [66.67, -57.33], [68, -58.33], [69.33, -58], [71, -57.67], [71.67, -59.67], [72.67, -62], [73, -64.33], [73, -66.33], [72.33, -68.67], [71.67, -70], [71, -71.33], [72, -74], [70, -74.33], [67.33, -76], [64, -79.67], [61, -82.67], [64.67, -85.33], [64.67, -85.67], [60.67, -88], [58, -89.67], [55.67, -91], [52.33, -92], [49, -92.67], [47.67, -93.67], [46, -94.67], [44, -96], [39, -96.67], [37.33, -96.67], [34.67, -97], [32, -97.67], [31.33, -96], [31, -95], [31.33, -93.67], [32.33, -91.67], [33.33, -91], [33.33, -90], [36, -87.33], [39, -85], [42, -81.67], [45.33, -79.33], [47.67, -78], [49.67, -75], [50.33, -72.33], [50.33, -68.67], [50.33, -66], [51, -63.67], [55.33, -60.33], [58.67, -57.33], [61.33, -55],
],
],
},
}, {
type: 'Feature',
properties: {
name: 'Antarctica',
color: '#057d85',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[50.33, -66], [50.33, -68.67], [50.33, -72.33], [49.67, -75], [47.67, -78], [45.33, -79.33], [42, -81.67], [39, -85], [36, -87.33], [33.33, -90], [32.67, -89.33], [30.33, -87.67], [28.67, -86.67], [27, -84.67], [23.67, -84.33], [19.33, -87.33], [19.67, -87.67], [15, -89.33], [12.33, -89.33], [9, -88.67], [4.33, -86.67], [-0.67, -85], [-4, -83.67], [-3.67, -82], [-2, -78.33], [-4.33, -78.33], [-7.33, -75.33], [-8.67, -74], [-10.33, -71.67], [-7.67, -71.67], [-4.33, -71.67], [-0.67, -72.33], [1.67, -73], [3.67, -73.33], [5.33, -73.33], [6.33, -72.67], [7, -70.33], [7.33, -66.67], [8, -63.33], [9, -61], [10.67, -58.67], [14.33, -57], [19.33, -54.67], [24.33, -53.67], [29.67, -52.33], [34.33, -51], [35.33, -51], [36.67, -51], [38, -51.67], [39.33, -53.67], [39.67, -55.33], [39.67, -56.67], [40.33, -58.33], [42, -58.33], [44.33, -58], [47, -58.33], [49.33, -59.33], [50.67, -61.33], [51, -62],
],
],
},
}, {
type: 'Feature',
properties: {
name: 'Africa',
color: '#ab394b',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[7.67, -61.67], [3.33, -61.67], [0.67, -63.67], [-2, -65], [-5.33, -65.67], [-9.33, -66], [-12, -65.33], [-13.33, -64.33], [-13.67, -63.33], [-13.67, -62.33], [-12.33, -61.33], [-11, -58.67], [-10.33, -56.67], [-10, -54.67], [-10, -53], [-10.33, -50], [-11, -48], [-11.33, -47], [-11.33, -46.33], [-11.33, -45.33], [-9.33, -43.67], [-7, -41], [-5, -38.67], [-4.33, -37], [-3.67, -35.33], [-3.67, -33.33], [-4, -31.67], [-4.33, -30], [-3.67, -28.33], [-3.33, -26.33], [-3, -25.33], [-3.67, -23.67], [-5, -22.67], [-7, -21], [-8, -19.33], [-9.33, -17], [-9.67, -15.67], [-11, -14.33], [-14, -13.67], [-16.67, -14], [-20.33, -12.67], [-21.33, -11.33], [-22.33, -7.33], [-24.33, -3.33], [-24.67, -0.67], [-23.33, 2], [-21, 5.33], [-18.33, 6.33], [-15.33, 8], [-11.67, 10.33], [-8.67, 12.33], [-5.33, 13], [-2, 13], [0, 12.67], [2.67, 11.33], [5, 10.33], [8, 9.33], [9.67, 8.67], [10.33, 7.67], [10, 6.67], [8.67, 5.67], [9.67, 4.33], [11.33, 2.33], [13, 0.67], [15.33, 0], [16.67, 0], [16.67, 1.67], [17.67, 1.33], [19, 0.33], [21, -1], [23.33, -1.67], [25.67, -1.67], [28.33, -2], [27.67, -3.67], [27.33, -5.67], [27, -8.33], [28, -11], [29, -14.33], [30.67, -19], [33, -25.67], [33, -26.33], [33.67, -27.33], [34.67, -28.33], [35.67, -28.33], [36.67, -28.33], [38.67, -28], [40, -28], [41, -28.33], [40.67, -30], [39, -32.67], [36.67, -34.67], [34.67, -36], [31.67, -38], [27.67, -39.33], [24.67, -42], [23.33, -43.33], [22.33, -45.33], [21.67, -47.33], [22, -48.67], [21.67, -50.67], [19.33, -52.33], [16, -55], [14.33, -57], [10.67, -58.67], [9, -61], [8, -63.33],
],
],
},
}, {
type: 'Feature',
properties: {
name: 'South America',
color: '#dac599',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-51.33, -10.67], [-46.67, -10.67], [-43, -11.33], [-35.33, -12.67], [-35.33, -14.33], [-34.67, -15], [-32.67, -15], [-29, -15.67], [-27, -17.33], [-25.33, -19], [-24.33, -19.67], [-21.67, -20], [-17.67, -20.33], [-13.33, -20.33], [-11, -22], [-9.33, -24.33], [-8.67, -27], [-9, -29.33], [-10, -31.33], [-10.33, -33.67], [-10.33, -36.33], [-11, -39], [-13.33, -42.67], [-15.33, -45], [-16.33, -47.33], [-16.67, -50.33], [-17.33, -53], [-17, -54], [-17.67, -55], [-19.33, -56], [-20.33, -57], [-20.67, -57.67], [-20, -60], [-19, -61.33], [-20.33, -62.67], [-22, -64], [-22, -65.67], [-21.67, -67], [-21.33, -67.33], [-22.33, -68], [-22.67, -69], [-21.67, -70], [-20, -72], [-19.33, -74], [-17.33, -74.67], [-15.67, -76.67], [-14.67, -77.33], [-14.67, -78.33], [-16.33, -79], [-18.67, -80], [-20.33, -79.67], [-26, -73], [-33, -66.67], [-33.33, -61.67], [-33.33, -57.33], [-33.33, -55], [-33.67, -52.67], [-35, -50.67], [-37.33, -48.33], [-39.67, -46.67], [-42.33, -45], [-43, -44.67], [-45, -44], [-46.33, -42.33], [-46.67, -41.67], [-49, -41], [-50.33, -41], [-51.67, -40.67], [-52, -39], [-52.33, -38], [-52.67, -37.33], [-53.33, -36.67], [-54.67, -36], [-56.33, -36], [-57, -35.67], [-57.67, -34.67], [-57.67, -33.33], [-57, -31.67], [-56.67, -29.67], [-56.33, -29.33], [-56.67, -27.33], [-57.33, -25.67], [-57.67, -24.33], [-56.33, -23.67], [-55.33, -23], [-55, -21.67], [-55.67, -19.33], [-57, -18.33], [-60.33, -18.33], [-62.33, -17], [-63.33, -16.33], [-62, -15], [-58.67, -15.33], [-56.33, -15], [-53.33, -13.67], [-51.67, -11.33],
],
],
},
}, {
type: 'Feature',
properties: {
name: 'North America',
color: '#153459',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-57.67, 50], [-57, 52], [-56.67, 53], [-57, 54.67], [-56.67, 55.33], [-55.33, 55.67], [-53.67, 56], [-52, 56.33], [-50.67, 57.33], [-49.67, 58.67], [-48.33, 59], [-46.67, 59], [-45.33, 59.67], [-43.67, 60], [-42.33, 59], [-41.67, 57.33], [-42.33, 55.33], [-43, 53.67], [-41.33, 52.67], [-42, 51.67], [-41.33, 50], [-40, 48.67], [-39, 48], [-37.33, 47.67], [-35.33, 50.33], [-34, 47], [-32, 45], [-32.67, 43.33], [-32, 42.67], [-28, 41.67], [-25, 38], [-30.67, 34.33], [-31.67, 33.33], [-32.33, 32], [-32, 30], [-31, 27.67], [-29, 25.67], [-27.67, 24.33], [-26.67, 22.67], [-25, 22.67], [-23, 23.67], [-22, 25.33], [-21.67, 27], [-21.67, 28.67], [-21.33, 30.33], [-20.33, 31.33], [-19.33, 31.67], [-17.33, 31.67], [-15.67, 31], [-14, 29.67], [-12, 27.67], [-10.33, 25], [-9.67, 22.67], [-12.33, 22.33], [-13.33, 21.67], [-14.33, 20.33], [-14.67, 19], [-14, 17], [-17.33, 15.33], [-19, 13.67], [-20, 11], [-22, 10.33], [-24.67, 7.33], [-26.33, 5], [-29, 2.33], [-30.33, 1], [-31, 0], [-29.33, -2], [-29, -3.67], [-31.67, -4], [-32.33, -2.33], [-33.33, -1], [-35, -0.33], [-36.33, -0.33], [-38.67, -3], [-40.67, -3.33], [-43, -3.33], [-44.67, -3.33], [-46, -4.67], [-46.33, -6.33], [-46.67, -8], [-46.33, -10], [-46.67, -10.67], [-51.33, -10.67], [-52, -8.33], [-53.33, -5.33], [-55.67, -3.67], [-58.33, -2.67], [-59.67, -2.67], [-60.67, -1.67], [-61, 0], [-60.33, 0.67], [-59.33, 3], [-59.33, 4.33], [-59.33, 6.33], [-60.33, 10], [-62, 12], [-63.67, 14], [-64, 15], [-63, 18.67], [-61.67, 21.67], [-60, 25.67], [-57.33, 32], [-55.67, 35.67], [-55, 38.33], [-54, 42], [-54.33, 44], [-54.33, 45], [-54, 46.33], [-53.67, 47.67], [-55, 48.67], [-57, 49.67],
],
],
},
}, {
type: 'Feature',
properties: {
name: 'India',
color: '#b1d2c6',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[44.67, -26.33], [45, -26.33], [46.33, -26.67], [49, -27.67], [51, -28], [53.33, -30.33], [54.33, -33.67], [55, -34.67], [53.67, -36.33], [52, -40.33], [51.33, -42.33], [52, -43.67], [54, -45.33], [54.33, -46], [54.67, -47.33], [55, -48.67], [57.33, -50], [60, -51.33], [62, -52.33], [64, -53.33], [61.33, -55], [58.67, -57.33], [55.33, -60.33], [51, -63.67], [51.33, -62.33], [51, -62], [50.67, -61.33], [49.33, -59.33], [47, -58.33], [47.33, -57.67], [47.67, -57.33], [49, -56], [50.67, -55], [51.67, -54], [49, -53.33], [46.33, -52.67], [42.67, -52.33], [39.67, -53.33], [39.67, -53.67], [38, -51.67], [36.67, -51], [35.33, -51], [34.33, -51], [29.67, -52.33], [28.67, -52.33], [30, -51.33], [31.33, -49], [33.33, -46.33], [35, -43], [37.33, -41], [40, -39.67], [40.67, -39], [41, -38], [40.33, -36.33], [36.67, -34.67], [39, -32.67], [40.67, -30], [41, -28.33], [41.33, -28],
],
],
},
}],
};
window.exports = window.exports || {};
window.config = {
transpiler: 'ts',
typescriptOptions: {
module: 'system',
emitDecoratorMetadata: true,
experimentalDecorators: true,
jsx: 'react',
},
meta: {
'react': {
'esModule': true,
},
'typescript': {
'exports': 'ts',
},
'devextreme/time_zone_utils.js': {
'esModule': true,
},
'devextreme/localization.js': {
'esModule': true,
},
'devextreme/viz/palette.js': {
'esModule': true,
},
'devextreme-dist/js/vectormap-data/*': {
'esModule': true,
},
'openai': {
'esModule': true,
},
},
paths: {
'npm:': 'https://unpkg.com/',
'bundles:': '../../../../bundles/',
'externals:': '../../../../bundles/externals/',
},
defaultExtension: 'js',
map: {
'ts': 'npm:plugin-typescript@8.0.0/lib/plugin.js',
'typescript': 'npm:typescript@4.2.4/lib/typescript.js',
'jszip': 'npm:jszip@3.10.1/dist/jszip.min.js',
'react': 'npm:react@17.0.2/umd/react.development.js',
'react-dom': 'npm:react-dom@17.0.2/umd/react-dom.development.js',
'prop-types': 'npm:prop-types/prop-types.js',
'devextreme-dist/js/vectormap-data': 'npm:devextreme-dist@link:../../packages/devextreme/artifacts/npm/devextreme-dist/js/vectormap-data',
'rrule': 'npm:rrule@2.6.4/dist/es5/rrule.js',
'luxon': 'npm:luxon@3.4.4/build/global/luxon.min.js',
'es6-object-assign': 'npm:es6-object-assign',
'devextreme': 'npm:devextreme@link:../../packages/devextreme/artifacts/npm/devextreme/cjs',
'devextreme-react': 'npm:devextreme-react@link:../../packages/devextreme-react/npm/cjs',
'devextreme-quill': 'npm:devextreme-quill@1.7.1/dist/dx-quill.min.js',
'devexpress-diagram': 'npm:devexpress-diagram@2.2.5/dist/dx-diagram.js',
'devexpress-gantt': 'npm:devexpress-gantt@4.1.54/dist/dx-gantt.js',
'@devextreme/runtime': 'npm:@devextreme/runtime@3.0.12',
'inferno': 'npm:inferno@7.4.11/dist/inferno.min.js',
'inferno-compat': 'npm:inferno-compat/dist/inferno-compat.min.js',
'inferno-create-element': 'npm:inferno-create-element@7.4.11/dist/inferno-create-element.min.js',
'inferno-dom': 'npm:inferno-dom/dist/inferno-dom.min.js',
'inferno-hydrate': 'npm:inferno-hydrate/dist/inferno-hydrate.min.js',
'inferno-clone-vnode': 'npm:inferno-clone-vnode/dist/inferno-clone-vnode.min.js',
'inferno-create-class': 'npm:inferno-create-class/dist/inferno-create-class.min.js',
'inferno-extras': 'npm:inferno-extras/dist/inferno-extras.min.js',
'devextreme-cldr-data': 'npm:devextreme-cldr-data@1.0.3',
// SystemJS plugins
'plugin-babel': 'npm:systemjs-plugin-babel@0.0.25/plugin-babel.js',
'systemjs-babel-build': 'npm:systemjs-plugin-babel@0.0.25/systemjs-babel-browser.js',
// Prettier
'prettier/standalone': 'npm:prettier@2.8.8/standalone.js',
'prettier/parser-html': 'npm:prettier@2.8.8/parser-html.js',
},
packages: {
'devextreme': {
defaultExtension: 'js',
},
'devextreme-react': {
main: 'index.js',
},
'devextreme/events/utils': {
main: 'index',
},
'devextreme/localization/messages': {
format: 'json',
defaultExtension: 'json',
},
'devextreme/events': {
main: 'index',
},
'es6-object-assign': {
main: './index.js',
defaultExtension: 'js',
},
},
packageConfigPaths: [
'npm:@devextreme/*/package.json',
'npm:@devextreme/runtime@3.0.12/inferno/package.json',
],
babelOptions: {
sourceMaps: false,
stage0: true,
react: true,
},
};
System.config(window.config);
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.js';
ReactDOM.render(<App />, document.getElementById('app'));
/* eslint-disable max-len */
export const pangaeaBorders = {
type: 'FeatureCollection',
features: [
{
type: 'Feature',
properties: {
name: 'Pangaea',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-28, 86.33],
[-28, 88],
[-27.33, 89.67],
[-25.67, 91.67],
[-21.33, 93.67],
[-15, 95.67],
[-7.67, 98.67],
[-4.67, 99.33],
[-1, 99.33],
[4.67, 99],
[9.33, 97.33],
[13.33, 96],
[19, 96],
[25.33, 95],
[29.33, 93],
[34.67, 91.67],
[41.67, 89.33],
[45.33, 88.67],
[48.67, 85.67],
[52, 82.33],
[55.67, 79.67],
[60.67, 75.67],
[64, 71.67],
[64.67, 70.67],
[65.67, 68.33],
[66.33, 67.33],
[67, 66.33],
[69, 65],
[72, 63.33],
[75.33, 61],
[78.33, 58.33],
[80.33, 56],
[81.67, 53],
[84, 50],
[84.67, 48],
[84.67, 46.67],
[82.33, 47.67],
[81, 48.33],
[80.33, 48.33],
[79.67, 47.67],
[80.33, 45],
[82.33, 43.33],
[85, 40.67],
[87.33, 38.67],
[90, 36.67],
[92, 35.67],
[92, 36.33],
[91, 38],
[90, 39.67],
[93.33, 40],
[96.67, 39.67],
[97.67, 39],
[98.67, 37.67],
[99.33, 36.33],
[102, 25],
[101.67, 23],
[99.33, 22],
[96.33, 22.67],
[93.33, 25],
[92, 27],
[90.33, 28],
[89.33, 30.33],
[89.33, 32],
[90.33, 32.67],
[91.33, 33.33],
[89, 35],
[84.33, 38],
[81.67, 40],
[79.33, 41.67],
[77.67, 43.33],
[75.67, 45],
[74, 46.67],
[72.67, 49],
[70.67, 50],
[67.67, 50.67],
[64.67, 50.67],
[62, 50.33],
[59.67, 49.33],
[56.67, 46.33],
[54.33, 44],
[54.33, 41.33],
[51.67, 38],
[50, 35.67],
[48.33, 33.67],
[48.33, 32.33],
[42.33, 31.33],
[37.67, 31.67],
[35.67, 32],
[30.33, 31],
[26.33, 30.33],
[22, 31.67],
[17, 33.33],
[13, 32.67],
[11.67, 32],
[10, 30],
[8, 26.67],
[8, 23],
[8, 20],
[8.67, 19.33],
[9.33, 18],
[9.33, 15.33],
[11.33, 12.67],
[12.67, 10.67],
[15.33, 8.67],
[19, 6],
[24, 4.67],
[26, 4.67],
[37.67, 4.33],
[40.67, 1.67],
[40.67, 0.33],
[40.33, -1.33],
[40.67, -3],
[41.67, -4.33],
[41.67, -5.33],
[40.33, -6.67],
[39, -9.33],
[38, -10.67],
[37.33, -14],
[38.67, -17],
[42.33, -18.67],
[44.33, -19],
[47, -19],
[48.67, -18.67],
[50.33, -19.67],
[50.33, -21],
[48, -21.33],
[47, -22.67],
[46, -24.33],
[45, -26.33],
[46.33, -26.67],
[49, -27.67],
[51, -28],
[53.33, -30.33],
[54.33, -33.67],
[55, -34.67],
[53.67, -36.33],
[52, -40.33],
[51.33, -42.33],
[52, -43.67],
[54, -45.33],
[54.33, -46],
[54.67, -47.33],
[55, -48.67],
[57.33, -50],
[60, -51.33],
[62, -52.33],
[64.33, -53.67],
[64.67, -54],
[65.33, -55.67],
[66.67, -57.33],
[68, -58.33],
[69.33, -58],
[71, -57.67],
[71.67, -59.67],
[72.67, -62],
[73, -64.33],
[73, -66.33],
[72.33, -68.67],
[71.67, -70],
[71, -71.33],
[71.67, -73.67],
[72.67, -75],
[72.67, -77],
[71.33, -80],
[68.67, -81.67],
[65.67, -84.67],
[64.33, -85.67],
[60.67, -88],
[58, -89.67],
[55.67, -91],
[52.33, -92],
[49, -92.67],
[47.67, -93.67],
[46, -94.67],
[44, -96],
[39, -96.67],
[37.33, -96.67],
[34.67, -97],
[32, -97.67],
[32.33, -98.67],
[28.67, -99.67],
[23.67, -99.33],
[21.67, -99.33],
[22.33, -97.33],
[22, -96.33],
[21, -95.67],
[19.67, -95.33],
[18.67, -94.67],
[17.67, -94],
[18.67, -92.67],
[19.67, -91],
[19.67, -89.67],
[19.67, -87.67],
[15, -89.33],
[12.33, -89.33],
[9, -88.67],
[4.33, -86.67],
[-0.67, -85],
[-4, -83.67],
[-3.67, -82],
[-2, -78.33],
[-4.33, -78.33],
[-7.33, -75.33],
[-8.67, -74],
[-11, -73],
[-13, -73.33],
[-15, -73.33],
[-17.33, -74.67],
[-15.67, -76.67],
[-14.67, -77.33],
[-14.67, -78.33],
[-16.33, -79],
[-18.67, -80],
[-20.33, -79.67],
[-26, -73],
[-33, -66.67],
[-33.33, -61.67],
[-33.33, -57.33],
[-33.33, -55],
[-33.67, -52.67],
[-35, -50.67],
[-37.33, -48.33],
[-39.67, -46.67],
[-42.33, -45],
[-43, -44.67],
[-45, -44],
[-46.33, -42.33],
[-46.67, -41.67],
[-49, -41],
[-50.33, -41],
[-51.67, -40.67],
[-52, -39],
[-52.33, -38],
[-52.67, -37.33],
[-53.33, -36.67],
[-54.67, -36],
[-56.33, -36],
[-57, -35.67],
[-57.67, -34.67],
[-57.67, -33.33],
[-57, -31.67],
[-56.67, -29.67],
[-56.33, -29.33],
[-56.67, -27.33],
[-57.33, -25.67],
[-57.67, -24.33],
[-56.33, -23.67],
[-55.33, -23],
[-55, -21.67],
[-55.67, -19.33],
[-57, -18.33],
[-60.33, -18.33],
[-62.33, -17],
[-63.33, -16.33],
[-62, -15],
[-58.67, -15.33],
[-56.33, -15],
[-53.33, -13.67],
[-51.67, -11.33],
[-51.33, -10.67],
[-52, -8.33],
[-53.33, -5.33],
[-55.67, -3.67],
[-58.33, -2.67],
[-59.67, -2.67],
[-60.67, -1.67],
[-61, 0],
[-60.33, 0.67],
[-59.33, 3],
[-59.33, 4.33],
[-59.33, 6.33],
[-60.33, 10],
[-62, 12],
[-63.67, 14],
[-64, 15],
[-63, 18.67],
[-61.67, 21.67],
[-60, 25.67],
[-57.33, 32],
[-55.67, 35.67],
[-55, 38.33],
[-54, 42],
[-54.33, 44],
[-54.33, 45],
[-54, 46.33],
[-53.67, 47.67],
[-55, 48.67],
[-57, 49.67],
[-59.33, 50],
[-61.33, 51],
[-62.67, 51.33],
[-63.33, 52.33],
[-61.67, 54],
[-61.67, 56.67],
[-60, 58],
[-57.33, 60],
[-55.67, 61.67],
[-52, 61.67],
[-50.33, 63.67],
[-45.67, 63],
[-42.67, 62.67],
[-40.67, 62.33],
[-39.33, 64],
[-37.67, 66],
[-36.67, 67],
[-35, 67.33],
[-32, 67],
[-30.33, 66],
[-27.67, 64],
[-25.33, 63.33],
[-23.33, 63.67],
[-21.33, 64],
[-19.33, 64.33],
[-17, 63.67],
[-14.67, 62.33],
[-12.33, 61],
[-9.33, 61],
[-8.33, 63.67],
[-9, 67],
[-10.33, 70.33],
[-14, 73],
[-15.33, 73],
[-16.67, 74],
[-17, 76],
[-18.67, 78.33],
[-20.67, 79],
[-22.67, 79],
[-25.67, 79],
[-28.67, 78],
[-30.33, 77],
[-31.67, 76],
[-33.33, 77],
[-34.67, 79.67],
[-34, 81],
[-32.67, 82],
[-32, 83.67],
[-32.67, 85.67],
[-32.67, 86.67],
[-31, 87],
[-28.33, 86.67],
],
],
},
},
],
};
export const pangaeaContinents = {
type: 'FeatureCollection',
features: [
{
type: 'Feature',
properties: {
name: 'Eurasia',
color: '#70b3a1',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-28.33, 86.67],
[-27.33, 85],
[-26.33, 84.33],
[-24.33, 83.67],
[-22.67, 84],
[-21.33, 85],
[-20.33, 86.33],
[-18.33, 86.33],
[-15.67, 86.33],
[-13, 86.67],
[-10.33, 86.67],
[-7, 86.33],
[-3.67, 86.67],
[-2, 87.67],
[-0.67, 88.67],
[-2, 88.67],
[-3.33, 89],
[-5.67, 90.33],
[-7, 91.33],
[-5.67, 92.33],
[-2, 93.33],
[2, 93.33],
[7.67, 92.67],
[10.67, 92.67],
[16.33, 92],
[20.33, 92],
[24.67, 92],
[26.67, 92],
[27.67, 91.33],
[28, 90.33],
[27, 89.33],
[26.67, 88],
[27.33, 86.67],
[29, 85.67],
[37.33, 85.67],
[38.67, 84.33],
[41.33, 83],
[42, 84.33],
[43.33, 84.33],
[47.33, 82],
[50.67, 80.33],
[55.67, 79.67],
[60.67, 75.67],
[64, 71.67],
[64.67, 70.67],
[65.67, 68.33],
[66.33, 67.33],
[67, 66.33],
[69, 65],
[72, 63.33],
[75.33, 61],
[78.33, 58.33],
[80.33, 56],
[81.67, 53],
[84, 50],
[84.67, 48],
[84.67, 46.67],
[82.33, 47.67],
[81, 48.33],
[80.33, 48.33],
[79.67, 47.67],
[80.33, 45],
[82.33, 43.33],
[85, 40.67],
[87.33, 38.67],
[90, 36.67],
[92, 35.67],
[92, 36.33],
[91, 38],
[90, 39.67],
[93.33, 40],
[96.67, 39.67],
[97.67, 39],
[98.67, 37.67],
[99.33, 36.33],
[102, 25],
[101.67, 23],
[99.33, 22],
[96.33, 22.67],
[93.33, 25],
[92, 27],
[90.33, 28],
[89.33, 30.33],
[89.33, 32],
[90.33, 32.67],
[91.33, 33.33],
[89, 35],
[84.33, 38],
[81.67, 40],
[79.33, 41.67],
[77.67, 43.33],
[75.67, 45],
[74, 46.67],
[72.67, 49],
[70.67, 50],
[67.67, 50.67],
[64.67, 50.67],
[62, 50.33],
[59.67, 49.33],
[56.67, 46.33],
[54.33, 44],
[54.33, 41.33],
[51.67, 38],
[50, 35.67],
[48.33, 33.67],
[48.33, 32.33],
[42.33, 31.33],
[37.67, 31.67],
[35.67, 32],
[30.33, 31],
[26.33, 30.33],
[22, 31.67],
[17, 33.33],
[13, 33],
[13.67, 34.67],
[15, 37.67],
[15.33, 40],
[14.33, 41.33],
[11.67, 41.67],
[8.67, 43.33],
[8, 45],
[6, 44.67],
[6.67, 41.67],
[7.67, 39.33],
[8.33, 35.67],
[9, 32.33],
[9.33, 29.67],
[7.67, 32.67],
[6, 34.67],
[3.67, 36],
[2.33, 36.33],
[1.67, 37.33],
[1.67, 39],
[2.33, 40.33],
[2.33, 42.67],
[2, 44.67],
[2, 46.33],
[2, 47.33],
[3, 48.33],
[4, 49.33],
[6.33, 49.33],
[7.67, 49.67],
[9, 50],
[8.67, 49],
[8.67, 47.67],
[10.67, 47.67],
[13, 47.67],
[15.33, 48.33],
[17, 49.33],
[14, 50.67],
[12.33, 51.67],
[12, 52.33],
[12, 54],
[12, 55.33],
[9, 55.33],
[6.33, 56],
[4, 56.67],
[2.33, 57.67],
[3, 58.67],
[2.67, 60.67],
[4.67, 59.33],
[6, 58.33],
[7.67, 57.33],
[9.67, 56.33],
[11.67, 56.33],
[12, 57.33],
[11.67, 58.67],
[11.67, 59.67],
[12.67, 60],
[14.33, 61],
[13.33, 62.67],
[11.67, 63.33],
[10.33, 63.33],
[7.67, 63.67],
[7.67, 65],
[6, 66],
[3, 67],
[-0.33, 67.67],
[-2.33, 67.67],
[-5, 68.67],
[-3.67, 69.67],
[-0.67, 71.33],
[-0.67, 73],
[-2.33, 74],
[-4.67, 75],
[-5.33, 75.33],
[-5.67, 77],
[-6.33, 78],
[-8.67, 78],
[-11.33, 77.33],
[-17, 76],
[-18.67, 78.33],
[-20.67, 79],
[-22.67, 79],
[-25.67, 79],
[-28.67, 78],
[-30.33, 77],
[-31.67, 76],
[-33.33, 77],
[-34.67, 79.67],
[-34, 81],
[-32.67, 82],
[-32, 83.67],
[-32.67, 85.67],
[-32.67, 86.67],
[-31, 87],
[-28.33, 86.67],
],
],
},
},
{
type: 'Feature',
properties: {
name: 'Australia',
color: '#bb626a',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[64.67, -54],
[65.33, -55.67],
[66.67, -57.33],
[68, -58.33],
[69.33, -58],
[71, -57.67],
[71.67, -59.67],
[72.67, -62],
[73, -64.33],
[73, -66.33],
[72.33, -68.67],
[71.67, -70],
[71, -71.33],
[72, -74],
[70, -74.33],
[67.33, -76],
[64, -79.67],
[61, -82.67],
[64.67, -85.33],
[64.67, -85.67],
[60.67, -88],
[58, -89.67],
[55.67, -91],
[52.33, -92],
[49, -92.67],
[47.67, -93.67],
[46, -94.67],
[44, -96],
[39, -96.67],
[37.33, -96.67],
[34.67, -97],
[32, -97.67],
[31.33, -96],
[31, -95],
[31.33, -93.67],
[32.33, -91.67],
[33.33, -91],
[33.33, -90],
[36, -87.33],
[39, -85],
[42, -81.67],
[45.33, -79.33],
[47.67, -78],
[49.67, -75],
[50.33, -72.33],
[50.33, -68.67],
[50.33, -66],
[51, -63.67],
[55.33, -60.33],
[58.67, -57.33],
[61.33, -55],
],
],
},
},
{
type: 'Feature',
properties: {
name: 'Antarctica',
color: '#057d85',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[50.33, -66],
[50.33, -68.67],
[50.33, -72.33],
[49.67, -75],
[47.67, -78],
[45.33, -79.33],
[42, -81.67],
[39, -85],
[36, -87.33],
[33.33, -90],
[32.67, -89.33],
[30.33, -87.67],
[28.67, -86.67],
[27, -84.67],
[23.67, -84.33],
[19.33, -87.33],
[19.67, -87.67],
[15, -89.33],
[12.33, -89.33],
[9, -88.67],
[4.33, -86.67],
[-0.67, -85],
[-4, -83.67],
[-3.67, -82],
[-2, -78.33],
[-4.33, -78.33],
[-7.33, -75.33],
[-8.67, -74],
[-10.33, -71.67],
[-7.67, -71.67],
[-4.33, -71.67],
[-0.67, -72.33],
[1.67, -73],
[3.67, -73.33],
[5.33, -73.33],
[6.33, -72.67],
[7, -70.33],
[7.33, -66.67],
[8, -63.33],
[9, -61],
[10.67, -58.67],
[14.33, -57],
[19.33, -54.67],
[24.33, -53.67],
[29.67, -52.33],
[34.33, -51],
[35.33, -51],
[36.67, -51],
[38, -51.67],
[39.33, -53.67],
[39.67, -55.33],
[39.67, -56.67],
[40.33, -58.33],
[42, -58.33],
[44.33, -58],
[47, -58.33],
[49.33, -59.33],
[50.67, -61.33],
[51, -62],
],
],
},
},
{
type: 'Feature',
properties: {
name: 'Africa',
color: '#ab394b',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[7.67, -61.67],
[3.33, -61.67],
[0.67, -63.67],
[-2, -65],
[-5.33, -65.67],
[-9.33, -66],
[-12, -65.33],
[-13.33, -64.33],
[-13.67, -63.33],
[-13.67, -62.33],
[-12.33, -61.33],
[-11, -58.67],
[-10.33, -56.67],
[-10, -54.67],
[-10, -53],
[-10.33, -50],
[-11, -48],
[-11.33, -47],
[-11.33, -46.33],
[-11.33, -45.33],
[-9.33, -43.67],
[-7, -41],
[-5, -38.67],
[-4.33, -37],
[-3.67, -35.33],
[-3.67, -33.33],
[-4, -31.67],
[-4.33, -30],
[-3.67, -28.33],
[-3.33, -26.33],
[-3, -25.33],
[-3.67, -23.67],
[-5, -22.67],
[-7, -21],
[-8, -19.33],
[-9.33, -17],
[-9.67, -15.67],
[-11, -14.33],
[-14, -13.67],
[-16.67, -14],
[-20.33, -12.67],
[-21.33, -11.33],
[-22.33, -7.33],
[-24.33, -3.33],
[-24.67, -0.67],
[-23.33, 2],
[-21, 5.33],
[-18.33, 6.33],
[-15.33, 8],
[-11.67, 10.33],
[-8.67, 12.33],
[-5.33, 13],
[-2, 13],
[0, 12.67],
[2.67, 11.33],
[5, 10.33],
[8, 9.33],
[9.67, 8.67],
[10.33, 7.67],
[10, 6.67],
[8.67, 5.67],
[9.67, 4.33],
[11.33, 2.33],
[13, 0.67],
[15.33, 0],
[16.67, 0],
[16.67, 1.67],
[17.67, 1.33],
[19, 0.33],
[21, -1],
[23.33, -1.67],
[25.67, -1.67],
[28.33, -2],
[27.67, -3.67],
[27.33, -5.67],
[27, -8.33],
[28, -11],
[29, -14.33],
[30.67, -19],
[33, -25.67],
[33, -26.33],
[33.67, -27.33],
[34.67, -28.33],
[35.67, -28.33],
[36.67, -28.33],
[38.67, -28],
[40, -28],
[41, -28.33],
[40.67, -30],
[39, -32.67],
[36.67, -34.67],
[34.67, -36],
[31.67, -38],
[27.67, -39.33],
[24.67, -42],
[23.33, -43.33],
[22.33, -45.33],
[21.67, -47.33],
[22, -48.67],
[21.67, -50.67],
[19.33, -52.33],
[16, -55],
[14.33, -57],
[10.67, -58.67],
[9, -61],
[8, -63.33],
],
],
},
},
{
type: 'Feature',
properties: {
name: 'South America',
color: '#dac599',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-51.33, -10.67],
[-46.67, -10.67],
[-43, -11.33],
[-35.33, -12.67],
[-35.33, -14.33],
[-34.67, -15],
[-32.67, -15],
[-29, -15.67],
[-27, -17.33],
[-25.33, -19],
[-24.33, -19.67],
[-21.67, -20],
[-17.67, -20.33],
[-13.33, -20.33],
[-11, -22],
[-9.33, -24.33],
[-8.67, -27],
[-9, -29.33],
[-10, -31.33],
[-10.33, -33.67],
[-10.33, -36.33],
[-11, -39],
[-13.33, -42.67],
[-15.33, -45],
[-16.33, -47.33],
[-16.67, -50.33],
[-17.33, -53],
[-17, -54],
[-17.67, -55],
[-19.33, -56],
[-20.33, -57],
[-20.67, -57.67],
[-20, -60],
[-19, -61.33],
[-20.33, -62.67],
[-22, -64],
[-22, -65.67],
[-21.67, -67],
[-21.33, -67.33],
[-22.33, -68],
[-22.67, -69],
[-21.67, -70],
[-20, -72],
[-19.33, -74],
[-17.33, -74.67],
[-15.67, -76.67],
[-14.67, -77.33],
[-14.67, -78.33],
[-16.33, -79],
[-18.67, -80],
[-20.33, -79.67],
[-26, -73],
[-33, -66.67],
[-33.33, -61.67],
[-33.33, -57.33],
[-33.33, -55],
[-33.67, -52.67],
[-35, -50.67],
[-37.33, -48.33],
[-39.67, -46.67],
[-42.33, -45],
[-43, -44.67],
[-45, -44],
[-46.33, -42.33],
[-46.67, -41.67],
[-49, -41],
[-50.33, -41],
[-51.67, -40.67],
[-52, -39],
[-52.33, -38],
[-52.67, -37.33],
[-53.33, -36.67],
[-54.67, -36],
[-56.33, -36],
[-57, -35.67],
[-57.67, -34.67],
[-57.67, -33.33],
[-57, -31.67],
[-56.67, -29.67],
[-56.33, -29.33],
[-56.67, -27.33],
[-57.33, -25.67],
[-57.67, -24.33],
[-56.33, -23.67],
[-55.33, -23],
[-55, -21.67],
[-55.67, -19.33],
[-57, -18.33],
[-60.33, -18.33],
[-62.33, -17],
[-63.33, -16.33],
[-62, -15],
[-58.67, -15.33],
[-56.33, -15],
[-53.33, -13.67],
[-51.67, -11.33],
],
],
},
},
{
type: 'Feature',
properties: {
name: 'North America',
color: '#153459',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[-57.67, 50],
[-57, 52],
[-56.67, 53],
[-57, 54.67],
[-56.67, 55.33],
[-55.33, 55.67],
[-53.67, 56],
[-52, 56.33],
[-50.67, 57.33],
[-49.67, 58.67],
[-48.33, 59],
[-46.67, 59],
[-45.33, 59.67],
[-43.67, 60],
[-42.33, 59],
[-41.67, 57.33],
[-42.33, 55.33],
[-43, 53.67],
[-41.33, 52.67],
[-42, 51.67],
[-41.33, 50],
[-40, 48.67],
[-39, 48],
[-37.33, 47.67],
[-35.33, 50.33],
[-34, 47],
[-32, 45],
[-32.67, 43.33],
[-32, 42.67],
[-28, 41.67],
[-25, 38],
[-30.67, 34.33],
[-31.67, 33.33],
[-32.33, 32],
[-32, 30],
[-31, 27.67],
[-29, 25.67],
[-27.67, 24.33],
[-26.67, 22.67],
[-25, 22.67],
[-23, 23.67],
[-22, 25.33],
[-21.67, 27],
[-21.67, 28.67],
[-21.33, 30.33],
[-20.33, 31.33],
[-19.33, 31.67],
[-17.33, 31.67],
[-15.67, 31],
[-14, 29.67],
[-12, 27.67],
[-10.33, 25],
[-9.67, 22.67],
[-12.33, 22.33],
[-13.33, 21.67],
[-14.33, 20.33],
[-14.67, 19],
[-14, 17],
[-17.33, 15.33],
[-19, 13.67],
[-20, 11],
[-22, 10.33],
[-24.67, 7.33],
[-26.33, 5],
[-29, 2.33],
[-30.33, 1],
[-31, 0],
[-29.33, -2],
[-29, -3.67],
[-31.67, -4],
[-32.33, -2.33],
[-33.33, -1],
[-35, -0.33],
[-36.33, -0.33],
[-38.67, -3],
[-40.67, -3.33],
[-43, -3.33],
[-44.67, -3.33],
[-46, -4.67],
[-46.33, -6.33],
[-46.67, -8],
[-46.33, -10],
[-46.67, -10.67],
[-51.33, -10.67],
[-52, -8.33],
[-53.33, -5.33],
[-55.67, -3.67],
[-58.33, -2.67],
[-59.67, -2.67],
[-60.67, -1.67],
[-61, 0],
[-60.33, 0.67],
[-59.33, 3],
[-59.33, 4.33],
[-59.33, 6.33],
[-60.33, 10],
[-62, 12],
[-63.67, 14],
[-64, 15],
[-63, 18.67],
[-61.67, 21.67],
[-60, 25.67],
[-57.33, 32],
[-55.67, 35.67],
[-55, 38.33],
[-54, 42],
[-54.33, 44],
[-54.33, 45],
[-54, 46.33],
[-53.67, 47.67],
[-55, 48.67],
[-57, 49.67],
],
],
},
},
{
type: 'Feature',
properties: {
name: 'India',
color: '#b1d2c6',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[44.67, -26.33],
[45, -26.33],
[46.33, -26.67],
[49, -27.67],
[51, -28],
[53.33, -30.33],
[54.33, -33.67],
[55, -34.67],
[53.67, -36.33],
[52, -40.33],
[51.33, -42.33],
[52, -43.67],
[54, -45.33],
[54.33, -46],
[54.67, -47.33],
[55, -48.67],
[57.33, -50],
[60, -51.33],
[62, -52.33],
[64, -53.33],
[61.33, -55],
[58.67, -57.33],
[55.33, -60.33],
[51, -63.67],
[51.33, -62.33],
[51, -62],
[50.67, -61.33],
[49.33, -59.33],
[47, -58.33],
[47.33, -57.67],
[47.67, -57.33],
[49, -56],
[50.67, -55],
[51.67, -54],
[49, -53.33],
[46.33, -52.67],
[42.67, -52.33],
[39.67, -53.33],
[39.67, -53.67],
[38, -51.67],
[36.67, -51],
[35.33, -51],
[34.33, -51],
[29.67, -52.33],
[28.67, -52.33],
[30, -51.33],
[31.33, -49],
[33.33, -46.33],
[35, -43],
[37.33, -41],
[40, -39.67],
[40.67, -39],
[41, -38],
[40.33, -36.33],
[36.67, -34.67],
[39, -32.67],
[40.67, -30],
[41, -28.33],
[41.33, -28],
],
],
},
},
],
};
<!DOCTYPE html>
<html lang="en">
<head>
<title>DevExtreme Demo</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/24.2.3/css/dx.light.css" />
<link rel="stylesheet" type="text/css" href="styles.css" />
<script src="https://unpkg.com/core-js@2.6.12/client/shim.min.js"></script>
<script src="https://unpkg.com/systemjs@0.21.3/dist/system.js"></script>
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript">
System.import("./index.tsx");
</script>
</head>
<body class="dx-viewport">
<div class="demo-container">
<div id="app"></div>
</div>
</body>
</html>
#vector-map {
height: 570px;
}