DevExtreme v24.1 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.

Angular Vector Map - Multiple Layers

The VectorMap component allows you to employ multiple layers to present extra information on the map. In this demo, an additional layer indicates sea currents.

Backend API
<dx-vector-map id="map-container" [bounds]="[-180, 85, 180, -75]" [maxZoomFactor]="3" title="Sea Currents" > <dxo-export [enabled]="true"></dxo-export> <dxi-layer [dataSource]="worldMap" [hoverEnabled]="false"></dxi-layer> <dxi-layer name="water" [dataSource]="streamsData" colorGroupingField="tag" [colorGroups]="[0, 1, 2]" [palette]="['#3c20c8', '#d82020']" borderColor="none" [hoverEnabled]="false" ></dxi-layer> <dxi-legend horizontalAlignment="right" verticalAlignment="top" [customizeText]="customizeText" > <dxo-font [size]="14"></dxo-font> <dxo-source layer="water" grouping="color"></dxo-source> </dxi-legend> </dx-vector-map>
import { NgModule, Component, enableProdMode } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { DxVectorMapModule } from 'devextreme-angular'; import * as mapsData from 'devextreme-dist/js/vectormap-data/world.js'; import { FeatureCollection, Service } from './app.service'; if (!/localhost/.test(document.location.host)) { enableProdMode(); } @Component({ selector: 'demo-app', providers: [Service], templateUrl: `app/app.component.html`, styleUrls: [`app/app.component.css`], }) export class AppComponent { worldMap = mapsData.world; streamsData: FeatureCollection; constructor(service: Service) { this.streamsData = service.getStreamsData(); } customizeText = ({ color }) => (color === '#3c20c8' ? 'Cold' : 'Warm'); } @NgModule({ imports: [ BrowserModule, DxVectorMapModule, ], declarations: [AppComponent], bootstrap: [AppComponent], }) export class AppModule { } platformBrowserDynamic().bootstrapModule(AppModule);
::ng-deep #map-container { height: 550px; }
import { Injectable } from '@angular/core'; export class FeatureCollection { type: string; features: Feature[]; } export class Feature { type: string; properties: FeatureProperty; geometry: FeatureGeometry; } export class FeatureProperty { tag: number; } export class FeatureGeometry { type: string; coordinates: number[][][]; } const streamsData: FeatureCollection = { type: 'FeatureCollection', features: [{ type: 'Feature', properties: { tag: 0, }, geometry: { type: 'Polygon', coordinates: [ [ [-17.26391560048284, 72.23003475989351], [-15.463915600482844, 75.06131692974753], [-13.663915600482845, 77.21337772421425], [-10.063915600482844, 78.71294004150559], [-3.223915600482846, 80.28470187239857], [5.056084399517153, 80.81649410398445], [11.176084399517153, 80.52471967184563], [8.296084399517154, 79.52793978605553], [7.576084399517153, 78.49959209120071], [6.856084399517153, 77.37175607809803], [2.5360843995171543, 76.22129243068889], [-1.7839156004828463, 74.59019471245594], [-4.303915600482845, 73.19267119670779], [-8.263915600482845, 71.09786564044833], [-11.503915600482843, 69.1406529455296], [-15.463915600482844, 67.68421941453795], [-20.50391560048284, 66.84960318028834], [-26.26391560048284, 66.27689035857921], [-27.343915600482838, 65.98555066729956], [-32.023915600482844, 65.98555066729956], ], ], }, }, { type: 'Feature', properties: { tag: 0, }, geometry: { type: 'Polygon', coordinates: [ [ [-63.82918830920361, 74.71001623811459], [-60.22918830920361, 73.21944042532866], [-59.50918830920361, 72.03756844252803], [-58.069188309203604, 70.6565006586002], [-58.069188309203604, 68.52417629374179], [-55.54918830920361, 66.60171781289036], [-54.10918830920361, 63.41174280227835], [-51.589188309203614, 61.41194096940414], [-49.78918830920361, 58.90545623059517], [-46.90918830920361, 55.59751037650226], [-44.02918830920361, 51.762827813052766], [-43.309188309203606, 50.63498877301769], [-42.949188309203606, 46.838663002652524], [-46.54918830920361, 41.68747506398237], [-52.66918830920361, 38.09817441303129], [-57.709188309203604, 40.32925009568299], [-57.349188309203605, 43.01761992154989], [-52.30918830920361, 44.832428704385045], [-50.86918830920361, 46.59183876369354], [-50.50918830920361, 49.479423831897265], [-52.66918830920361, 52.20625242106371], [-53.74918830920361, 54.775439960023846], [-56.629188309203606, 57.191229586263304], [-58.78918830920361, 58.34317145763925], [-61.30918830920361, 60.5386685525199], [-63.10918830920361, 62.42854629694754], [-60.22918830920361, 64.04905009939385], [-59.14918830920361, 65.58055571917046], [-60.22918830920361, 67.85546853020765], [-61.66918830920361, 68.78623831143302], [-65.62918830920361, 70.6565006586002], [-67.42918830920361, 72.03756844252803], [-70.30918830920359, 73.32306288526817], [-69.94918830920359, 74.51899399703628], [-63.46918830920361, 74.51899399703628], [-62.38918830920361, 73.83191571163438], [-61.66918830920361, 73.21944042532866], ], ], }, }, { type: 'Feature', properties: { tag: 0, }, geometry: { type: 'Polygon', coordinates: [ [ [-19.12897402895556, 33.46477812445245], [-17.728902602206194, 31.965615865104013], [-17.34706494036546, 30.87951270624366], [-16.71066883729757, 28.446628085077865], [-16.328831175456834, 26.75480470176703], [-17.728902602206194, 24.922044372205956], [-18.36529870527409, 23.295645679758547], [-18.747136367114823, 21.412328564207204], [-18.874415587728404, 19.264292990587148], [-19.001694808341984, 16.356367114087373], [-18.747136367114823, 13.528261185318152], [-17.728902602206194, 11.540440242727254], [-16.328831175456834, 9.789384277153875], [-15.183318189934628, 8.029046619635654], [-14.928759748707469, 6.514025350287364], [-15.81971429300252, 5.881352069014289], [-17.34706494036546, 6.387551996469189], [-18.36529870527409, 7.650778684671905], [-20.01992857325061, 10.165446356974643], [-20.6563246763185, 10.916228740140395], [-21.801837661840707, 12.038815287261462], [-22.565512985522183, 14.02273221418618], [-22.565512985522183, 16.84426277994445], [-22.565512985522183, 18.058443594278675], [-22.69279220613576, 19.384401325742196], [-24.34742207411228, 18.17941139909912], [-25.111097397793753, 17.452364325571175], [-26.383889603929536, 15.376941307702026], [-27.402123368838165, 14.392889460954374], [-29.311311678041847, 14.269571074985265], [-30.584103884177626, 15.49962798016743], [-30.711383104791206, 17.695042139729484], [-30.711383104791206, 18.78298369761783], [-30.074987001723315, 20.34204266385237], [-28.54763635436037, 21.412328564207204], [-25.238376618407333, 22.59239362906708], [-22.69279220613576, 24.11142777365239], [-20.529045455704924, 25.267838189706456], [-18.874415587728404, 27.434664145705046], [-18.619857146501246, 28.110361511535945], [-18.36529870527409, 30.221857034567176], [-16.965227278524722, 30.98868758944844], [-15.056038969321046, 30.441570311623842], [-14.292363645639576, 29.780956945249166], ], ], }, }, { type: 'Feature', properties: { tag: 0, }, geometry: { type: 'Polygon', coordinates: [ [ [179.130883117546, 61.62624937574517], [175.18522727852505, 60.89186096805844], [173.6578766311621, 60.266663800083975], [171.4941298807313, 59.69357986306161], [168.56670780661898, 58.51736738320274], [167.1666363798696, 57.36905539073697], [165.76656495312025, 56.25440938749358], [164.11193508514373, 54.59339971079918], [163.09370132023508, 53.77412923052633], [161.82090911409932, 52.63063070529668], [159.14804548121418, 50.494796524934436], [157.11157795139692, 49.014812374627915], [154.43871431851178, 47.746866282076304], [151.51129224439944, 46.271583925475], [151.00217536194515, 44.66504052267136], [147.94747406721928, 42.16939889513758], [145.65644809617484, 41.31469515957236], [143.36542212513044, 39.57127055979687], [142.47446758083538, 37.27820000777605], [143.11086368390332, 35.4332838879848], [144.6382143312662, 34.59937669882057], [149.34754549396865, 34.38957474803093], [150.747616920718, 34.49454170942639], [154.05687665667102, 36.56593317276047], [154.69327275973896, 38.18415478347858], [154.82055198035252, 40.64207244478855], [158.12981171630557, 41.790935221714996], [162.33002599655364, 43.29127408888032], [164.8756104088252, 44.574445230458025], [166.27568183557457, 46.271583925475], [166.7847987180289, 47.83237940373456], [167.03935715925604, 49.595731042464614], [168.18487014477824, 50.413758663527894], [170.60317533643627, 52.164658641783426], [171.62140910134488, 53.24429310097075], [171.74868832195844, 54.297360663402515], [172.00324676318562, 55.7562712451854], [172.6396428662535, 57.024286339688366], [174.67611039607073, 58.25047715736638], [177.09441558772875, 58.979582985267925], [178.87632467631886, 59.69357986306161], [179.89455844122747, 60.643233136083495], [180.2763961030682, 61.50504115268334], [179.7672792206139, 61.927203886935786], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [51.134987001723346, 78.6781754094542], [54.01498700172334, 78.35568957150363], [54.91498700172334, 77.64485393749369], [54.91498700172334, 77.05364011870415], [51.85498700172335, 76.43464185049932], [47.174987001723345, 76.00593489238979], [42.494987001723345, 75.15451724327409], [35.83498700172335, 74.39842485565465], [30.07498700172335, 73.80683574533128], [26.834987001723352, 73.24540452235175], [23.054987001723354, 72.34038099115608], [15.494987001723354, 71.21499573797843], [12.614987001723355, 70.62666778202119], [10.454987001723355, 69.71085008767373], [8.654987001723354, 68.94847525890663], [4.694987001723356, 67.82151885700998], [-0.525012998276642, 65.91327269050296], [-4.125012998276644, 62.965206270876315], [-9.705012998276644, 60.67119210834117], [-9.705012998276672, 59.77736538635275], [-13.485012998276671, 58.2959051321437], [-15.645012998276673, 55.85093880668139], [-16.72501299827667, 54.410432573691665], [-20.68501299827667, 52.2613720702493], [-24.64501299827667, 50.118428528009055], [-28.425012998276667, 49.303684833025514], [-25.36501299827667, 48.35577340766194], [-22.845012998276665, 47.754207665798816], [-19.245012998276668, 45.78185884240408], [-16.00501299827667, 42.95178171094887], [-15.645012998276673, 40.53476737563477], [-15.645012998276673, 39.013096218970574], [-19.245012998276668, 38.73282266788404], [-22.665012998276666, 40.12310508276965], [-23.745012998276668, 41.48552762137147], [-25.54501299827667, 43.60698932438802], [-27.885012998276668, 44.64063424057449], [-31.30501299827667, 44.51241786106596], [-31.66501299827667, 43.34575301008127], [-31.84501299827667, 41.75465047652278], [-34.18501299827667, 39.57032201701956], [-38.14501299827666, 38.027314176450545], [-40.30501299827666, 35.43101670841256], [-48.22501299827666, 31.835293909015725], [-53.08501299827667, 30.448814325832387], [-55.785012998276656, 29.042328498925592], [-59.56501299827666, 27.296958383064748], [-58.66501299827666, 24.54519294337764], [-57.045012998276654, 20.556586961242864], [-54.52501299827666, 19.03236380384], [-52.36501299827666, 16.806043449174457], [-48.58501299827666, 13.855305639644431], [-45.88501299827666, 13.15521959571448], [-41.74501299827666, 12.804418476347305], [-38.50501299827666, 13.330432950501923], [-35.80501299827666, 13.680477511428197], [-32.925012998276664, 12.628833824672277], [-32.385012998276665, 10.68978843193038], [-32.205012998276665, 9.093926483288346], [-34.90501299827666, 7.847697438204939], [-40.485012998276666, 7.490918296344781], [-36.52501299827666, 5.523773914894679], [-33.46501299827666, 3.9093138839913504], [-30.04501299827667, 1.9319844309348446], [-27.165012998276666, -0.7676263873077133], [-24.285012998276663, -7.228397953698856], [-25.185012998276665, -9.010280093835243], [-20.505012998276666, -9.543215528055873], [-17.625012998276667, -8.832457791346755], [-12.945012998276669, -7.228397953698856], [-8.985012998276668, -7.585393392278546], [-8.985012998276668, -10.606545670947378], [-7.90501299827667, -14.81959198795535], [-9.705012998276668, -16.552479323194184], [-14.745012998276668, -17.24139138233079], [-18.525012998276665, -17.413222718707743], [-23.02501299827667, -19.292408498666866], [-24.825012998276662, -21.98723609418399], [-31.485012998276666, -22.819298169736182], [-33.64501299827667, -24.30418118801831], [-38.68501299827667, -30.375767505931428], [-41.74501299827667, -32.06888207582136], [-44.08501299827667, -35.215045790736504], [-45.885012998276665, -37.10413022537733], [-44.26501299827667, -40.74367081474836], [-45.345012998276665, -43.67595436600964], [-45.345012998276665, -46.22315099545295], [-42.82501299827666, -47.81823873024633], [-37.60501299827666, -49.01286391373607], [-35.44501299827667, -50.40947780258535], [-27.16501299827667, -51.09276699165658], [-22.30501299827667, -51.43067748675925], [-23.025012998276672, -52.97490409134545], [-30.405012998276675, -54.15080999371974], [-37.60501299827666, -54.882175899907125], [-42.64501299827666, -54.15080999371974], [-45.885012998276665, -52.53916748519045], [-50.02501299827667, -51.65457250113011], [-51.64501299827667, -49.716191204064714], [-53.26501299827667, -46.47165263111552], [-54.165012998276666, -44.32335409172249], [-53.985012998276666, -40.74367081474836], [-49.66501299827667, -38.947252517678855], [-48.40501299827667, -36.81647204109275], [-48.04501299827667, -32.373440100734015], [-47.14501299827667, -29.59624477422258], [-45.165012998276666, -26.90107732361158], [-41.925012998276664, -25.12174356957457], [-38.68501299827667, -23.811089959059473], [-36.34501299827667, -19.462212163277506], [-34.72501299827667, -15.861096575747432], [-34.54501299827667, -14.296932074396743], [-32.56501299827667, -7.763780973031608], [-28.24501299827667, -7.228397953698894], [-23.56501299827667, -7.049793502129411], [-27.885012998276668, -4.542881957879285], [-32.02501299827667, -2.386958593507023], [-37.96501299827666, -0.0476493471434864], [-44.08501299827667, 1.5721533278943292], [-45.885012998276665, 3.190700212581595], [-46.96501299827667, 6.597721190117572], [-50.20501299827666, 7.6693452633710075], [-53.44501299827667, 8.916145132433416], [-55.96501299827666, 10.335831943587431], [-57.22501299827667, 11.74913241293636], [-64.96501299827665, 14.204565941551667], [-67.84501299827664, 14.204565941551667], [-67.48501299827666, 15.94255656208609], [-63.34501299827665, 16.461108265257877], [-61.00501299827665, 16.461108265257877], [-62.26501299827665, 21.564427680943595], [-65.50501299827665, 22.398990953406184], [-70.36501299827665, 24.053033865426233], [-73.06501299827664, 25.035428944561136], [-74.50501299827664, 28.252510638642786], [-74.50501299827664, 29.982181587813795], [-73.24501299827664, 31.835293909015853], [-70.72501299827665, 34.249178537101706], [-69.46501299827665, 37.743187632327015], [-64.96501299827665, 38.16896600528855], [-60.28501299827666, 37.02808753185137], [-56.865012998276654, 36.161000745211034], [-53.62501299827665, 37.45796621629869], [-48.22501299827666, 37.45796621629869], [-43.90501299827665, 38.592271737992256], [-39.045012998276626, 43.47651233879497], [-36.34501299827663, 44.89621882471097], [-31.84501299827663, 47.63305068782099], [-31.48501299827663, 49.65453442106206], [-32.38501299827663, 53.34944203005041], [-31.84501299827663, 55.239941343619286], [-29.325012998276627, 56.05249911702447], [-27.16501299827663, 56.551822178636336], [-28.42501299827663, 56.551822178636336], [-26.98501299827663, 58.95190563962636], [-24.465012998276634, 59.77736538635285], [-23.565012998276632, 60.49437302838163], [-27.705012998276633, 60.40560013363738], [-31.12501299827663, 59.59566280912202], [-34.185012998276626, 58.1062072232592], [-39.045012998276626, 57.915494649534025], [-40.84501299827663, 59.321256599370315], [-38.865012998276626, 60.04807570415303], [-39.405012998276625, 61.62652865897909], [-37.24501299827663, 62.55325624692285], [-33.645012998276634, 62.9652062708766], [-29.325012998276627, 63.85143282456461], [-26.98501299827663, 63.53233391859595], [-23.385012998276633, 62.9652062708766], [-20.32501299827663, 62.55325624692285], [-16.185012998276633, 62.883276050230585], [-13.125012998276633, 63.45199634459799], [-2.685012998276611, 65.76592782755725], [-1.9650129982766107, 66.42236832563054], [-0.7050129982766097, 67.54813737359895], [2.1749870017233897, 68.6228091452381], [4.3349870017233885, 69.39645908389433], [7.034987001723389, 69.52277099683424], [9.554987001723386, 70.14328585231614], [11.534987001723387, 71.1569462377467], [15.134987001723387, 72.17582818055219], [19.814987001723395, 73.2972156989941], [22.3349870017234, 74.00641974871887], [24.314987001723395, 74.6386539928328], [25.754987001723396, 75.42872077040771], [29.894987001723393, 75.78662911503405], [31.334987001723395, 76.47679723721407], [33.6749870017234, 76.97273874837951], [35.6549870017234, 77.87382713699353], [39.614987001723385, 77.91158085947569], [43.75498700172339, 78.24619391719024], [45.5549870017234, 78.42812719162913], [49.334987001723384, 79.12848197700903], [53.47498700172339, 79.16237896956166], [55.09498700172339, 78.71345857342256], [54.19498700172339, 77.87382713699353], [52.21498700172339, 77.29339234835507], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [-76.05000000000005, 30.683576648641168], [-76.68000000000006, 29.358890588750764], [-77.04000000000006, 28.57147785636368], [-77.76000000000005, 28.096173462721996], [-79.02000000000005, 27.857726907267484], [-79.38000000000005, 26.738075331772958], [-79.56000000000004, 26.01240045773506], [-79.65000000000005, 25.526104406011523], [-80.55000000000005, 24.055453148224487], [-81.72000000000006, 24.13761043869208], [-83.52000000000005, 24.301766615936906], [-85.32000000000005, 23.808666092610792], [-85.59000000000006, 23.47888635361309], [-86.04000000000006, 22.733873491411533], [-85.95000000000006, 21.81777046141414], [-86.13000000000005, 20.81166159403789], [-85.68000000000005, 19.883449889854706], [-85.05000000000005, 18.949767719534453], [-83.61000000000006, 18.010832202033406], [-82.44000000000005, 16.722405232031726], [-81.72000000000006, 15.338438535071933], [-79.38000000000005, 14.119870159879659], [-76.95000000000006, 13.420569168142519], [-73.53000000000006, 13.683051687222505], [-71.91000000000005, 13.50809551369075], [-69.75000000000006, 13.245420922208314], [-68.94000000000005, 13.770481131226914], [-69.39000000000006, 14.904020509074538], [-69.03000000000006, 15.858548075535516], [-70.11000000000006, 16.722405232031726], [-71.28000000000006, 16.03162257760776], [-73.17000000000006, 16.03162257760776], [-75.96000000000005, 16.37731985263564], [-78.21000000000006, 16.722405232031726], [-80.64000000000006, 17.58236701608645], [-81.00000000000006, 18.608932814063646], [-81.45000000000005, 19.54455077789483], [-83.52000000000005, 20.81166159403789], [-84.69000000000005, 21.399397086377565], [-85.50000000000006, 21.650566396294582], [-85.59000000000006, 22.401440398076762], [-85.23000000000006, 23.231008630230352], [-84.15000000000005, 23.47888635361309], [-82.53000000000006, 23.72629913324642], [-80.64000000000006, 23.72629913324642], [-79.56000000000004, 23.72629913324642], [-79.20000000000005, 24.301766615936906], [-79.11000000000006, 24.956259704372652], [-79.11000000000006, 25.688424319321744], [-79.20000000000005, 26.416116029901307], [-79.29000000000005, 27.059125784374043], [-78.75000000000006, 27.379259901586313], [-77.04000000000006, 27.219307847476752], [-76.32000000000006, 26.65767041551216], [-76.41000000000005, 25.28221255035023], [-76.50000000000006, 24.71122679200982], [-76.50000000000006, 23.64388009838728], [-75.96000000000005, 22.982669737485914], [-74.43000000000005, 22.234924410688635], [-73.71000000000005, 22.650840440853482], [-74.52000000000005, 23.64388009838728], [-75.42000000000006, 25.037829357193935], [-75.78000000000006, 26.01240045773506], [-76.14000000000006, 26.9789487875625], ], ], }, }, { type: 'Feature', properties: { tag: 0, }, geometry: { type: 'Polygon', coordinates: [ [ [3.029571439503822, -4.207252928399285], [6.089571439503822, -6.00004234830572], [8.96957143950382, -9.033380349594081], [8.78957143950382, -12.393252450240531], [9.68957143950382, -17.607187835975193], [10.049571439503822, -20.49916847469425], [11.669571439503821, -24.32549606766353], [11.849571439503821, -28.831143694732557], [12.02957143950382, -31.630055792909808], [14.009571439503823, -35.82011266027417], [17.069571439503818, -39.93833299550222], [16.88957143950382, -42.64263983352489], [16.70957143950382, -46.36368608161874], [13.469571439503822, -50.194471340511924], [11.309571439503824, -56.81474839755995], [8.42957143950382, -57.78708839333531], [17.429571439503814, -57.78708839333531], [28.589571439503818, -56.61718459140351], [34.34957143950381, -54.164505944947216], [44.42957143950381, -53.097204674207276], [55.589571439503814, -52.0027535678673], [62.42957143950386, -51.33293265021952], [71.42957143950385, -50.42438157943307], [77.18957143950384, -51.557307082323796], [87.98957143950385, -51.557307082323796], [95.54957143950384, -49.26369035645748], [103.10957143950384, -46.61154953476175], [104.90957143950385, -42.77490568930513], [104.18957143950385, -36.40177916534364], [104.18957143950385, -32.2410739745611], [106.70957143950385, -27.88074579197622], [109.94957143950386, -28.515290937187874], [111.74957143950385, -31.323028991925007], [113.18957143950385, -35.23415270618526], [110.66957143950386, -41.4395813510643], [108.86957143950384, -48.31501530819279], [109.22957143950384, -51.33293265021952], [113.54957143950385, -53.31282735043994], [121.82957143950384, -53.74082409116702], [126.50957143950384, -53.31282735043994], [137.6695714395038, -55.20496967433147], [141.2695714395038, -56.41858153790548], [148.82957143950384, -53.74082409116702], [158.18957143950382, -53.74082409116702], [167.90957143950382, -55.20496967433147], [177.62957143950382, -55.20496967433147], [185.90957143950382, -54.99900797545377], [190.58957143950383, -54.37473518798973], [198.50957143950382, -54.99900797545377], [203.18957143950382, -56.81474839755997], [218.3095714395038, -57.401235508912734], [225.14957143950386, -57.97848295802807], [226.22957143950381, -60.90481113181701], [234.14957143950383, -64.68438712105615], [233.78957143950382, -66.32565927829312], [226.22957143950381, -68.00152286024598], [219.38957143950384, -68.00152286024598], [213.2695714395038, -67.03810984195727], [191.6695714395038, -65.74074922503578], [181.5895714395038, -65.4432259253323], [170.78957143950382, -66.0348833616619], [162.50957143950384, -63.90369018708317], [145.9495714395038, -61.76814520927988], [135.14957143950383, -59.65567721811326], [129.02957143950385, -60.19686631273748], [122.18957143950384, -61.425665568424996], [114.26957143950385, -60.552775428117435], [111.74957143950385, -58.54657863541495], [88.70957143950378, -60.19686631273748], [78.62957143950378, -59.83705505181724], [69.98957143950378, -59.289959519194376], [66.38957143950378, -58.73392565076289], [53.42957143950379, -59.65567721811326], [40.10957143950379, -61.079385509518275], [26.789571439503778, -60.3753068494617], [18.149571439503777, -60.72927564955039], [-0.930428560496213, -62.274803707780315], [-11.730428560496211, -63.100654675032565], [-18.570428560496207, -63.100654675032565], [-24.69042856049621, -62.77307869240927], [-34.4104285604962, -61.25300243314373], [-43.05042856049621, -60.72927564955039], [-51.3304285604962, -60.01745023498518], [-58.17042856049621, -60.55277542811742], [-67.53042856049619, -61.42566556842498], [-85.53042856049622, -62.93732489777563], [-109.29042856049622, -64.53001179828726], [-121.17042856049623, -64.83788811192174], [-135.9304285604962, -65.14228252643493], [-158.2504285604962, -65.59241315438604], [-171.57042856049623, -66.61310791273172], [-182.73042856049622, -66.61310791273172], [-190.65042856049624, -65.88823800480827], [-191.0104285604962, -62.77307869240927], [-191.7304285604962, -57.011276057842046], [-171.2104285604962, -57.78708839333531], [-165.0904285604962, -57.401235508912706], [-154.6504285604962, -55.40987140398272], [-147.0904285604962, -55.61371601240001], [-140.2504285604962, -56.61718459140352], [-130.89042856049625, -57.78708839333531], [-104.25042856049618, -58.168860640809115], [-98.85042856049617, -58.168860640809115], [-90.57042856049618, -55.40987140398273], [-90.93042856049618, -53.52736633822751], [-91.2904285604962, -47.59171786717484], [-90.93042856049618, -43.82287701565337], [-88.05042856049619, -37.83698236882228], [-85.17042856049618, -32.54505473221298], [-84.09042856049618, -25.954904670166588], [-86.25042856049619, -22.00892286264895], [-90.57042856049618, -18.2921387971206], [-99.57042856049618, -16.22954987939083], [-106.77042856049619, -13.095509655505872], [-104.97042856049617, -6.35795032839672], [-95.97042856049617, -8.143481803487424], [-90.21042856049618, -10.983150134641521], [-85.17042856049618, -13.445895744809578], [-78.69042856049619, -18.2921387971206], [-75.45042856049618, -21.004133870707133], [-75.09042856049618, -25.305755096214117], [-76.89042856049619, -31.630055792909808], [-76.89042856049619, -37.83698236882228], [-77.97042856049619, -41.43958135106428], [-79.05042856049619, -46.85828381035072], [-78.69042856049619, -49.963448674424065], [-77.61042856049619, -54.16450594494723], [-79.41042856049619, -58.168860640809115], [-83.73042856049618, -59.83705505181722], [-87.69042856049619, -60.55277542811742], [-77.97042856049619, -62.106854038816664], [-70.41042856049619, -62.106854038816664], [-64.6504285604962, -60.72927564955038], [-55.650428560496195, -59.65567721811325], [-46.290428560496196, -57.59467366230694], [-31.53042856049617, -58.16886064080934], [-24.690428560496166, -57.78708839333554], [-19.65042856049617, -56.61718459140375], [-12.810428560496172, -54.99900797545399], [-8.490428560496172, -52.22382974426492], [-5.250428560496171, -49.028202555670596], [-0.5704285604961727, -43.0385916315889], [-0.2104285604961725, -39.244796652329036], [1.2295714395038235, -36.111484393386206], [2.6695714395038244, -31.323028991925337], [3.0295714395038247, -28.198489348273696], [3.389571439503825, -23.33759675148815], [3.7495714395038253, -17.949994897389946], [2.6695714395038244, -13.445895744810011], [-2.010428560496174, -9.211103695141023], [-4.530428560496175, -5.641899227814463], [1.2295714395038235, -2.769959332908451], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [86.19789606480454, 1.8883333777439921], [80.59761035780708, 4.049047609989016], [77.41562984246762, 4.937254984390266], [74.87004543019606, 6.583471820900077], [73.21541556221953, 8.224248222940497], [68.25152595828997, 9.732838265931665], [64.81498700172335, 9.983637781838603], [60.996610383315996, 10.108965416808203], [56.414558441227165, 9.732838265931665], [53.86897402895559, 9.10502527884824], [52.214344160979074, 7.593909029605669], [51.577948057911186, 5.444282290798347], [50.68699351361614, 4.302930009484943], [49.923318189934655, 2.397092609004449], [49.41420130748035, 0.4885979749598348], [51.068831175456864, -0.6568946971245148], [53.99625324956918, -1.802124862654128], [57.432792206135794, -2.819517187705181], [60.61477272147526, -3.7090171874369364], [63.16035713374683, -4.216915056832626], [66.21505842847272, -5.358412035261833], [67.99696751706281, -7.129677984999741], [71.17894803240227, -8.768351346750912], [74.99732465080963, -10.14935194820833], [77.67018828369477, -11.27488326713674], [80.85216879903425, -12.396023947992202], [85.56149996173666, -13.14080881590675], [88.48892203584896, -13.14080881590675], [91.92546099241557, -13.14080881590675], [95.3619999489822, -12.147282164315353], [95.10744150775506, -10.524991220521974], [92.30729865425631, -8.642538471868995], [88.36164281523538, -7.886799918936311], [85.81605840296382, -6.877019008163834], [81.61584412271571, -6.497779972728859], [77.92474672492193, -5.991685700376148], [75.37916231265038, -5.104914253841218], [72.06990257669733, -4.597622920239993], [66.34233764908629, -2.4380820631449382], [63.287636354360416, -2.0565387881734076], [60.869331162702416, -1.6749042558074072], [58.83286363288516, -0.5296223255409027], [56.796396103067906, 1.2521795297986837], [56.414558441227165, 2.2699189601457], [56.414558441227165, 3.4140039705300076], [58.45102597104442, 4.175999077128579], [63.41491557497399, 4.175999077128579], [65.06954544295051, 3.6680762026433302], [69.39703894381218, 2.5242544425081657], [71.0516688117887, 2.5242544425081657], [73.08813634160596, 0.8704080778606726], [77.5429090630812, 0.23404480482283255], [80.85216879903425, 0.23404480482283255], [84.41598697621446, -0.020512985084017093], [85.94333762357739, -0.7841638273534531], [87.47068827094033, -1.5476753883643624], [91.28906488934769, -2.6923852047310084], [92.56185709548348, -3.0737388556879806], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [108.71201963771408, -23.879284169806198], [104.03201963771407, -20.71554564675511], [99.53201963771409, -18.340715172651315], [96.11201963771407, -16.623934737769584], [91.07201963771408, -15.586336644011002], [83.69201963771408, -15.239284293120681], [79.19201963771408, -14.717633898448536], [76.13201963771408, -13.670622206837036], [69.47201963771408, -11.739201887930568], [66.95201963771409, -10.67982143522288], [60.472019637714084, -9.261609094479278], [57.232019637714096, -7.6592930216015365], [51.83201963771409, -6.587645406908854], [46.79201963771409, -5.871901982000636], [43.91201963771409, -6.408801915727213], [43.19201963771409, -8.55029435842165], [41.93201963771409, -9.794157857444237], [42.11201963771409, -12.61893616717014], [41.39201963771409, -15.932803590408353], [40.31201963771409, -18.169774567922666], [38.69201963771409, -18.852518196943105], [37.79201963771409, -20.040611621220226], [37.25201963771409, -21.387486294293023], [37.25201963771409, -23.714587623991225], [36.352019637714086, -24.699605473508303], [34.91201963771409, -26.48524156085804], [34.73201963771409, -28.24357572899373], [31.672019637714097, -30.749952402882027], [30.592019637714095, -32.890986890130534], [27.352019637714097, -35.27593669244425], [24.832019637714094, -37.30687862525683], [25.012019637714094, -39.70113159251012], [27.352019637714086, -45.1435188064384], [30.232019637714085, -47.62621521221266], [34.192019637714075, -48.8252936385065], [36.89201963771408, -49.647967547757105], [40.85201963771408, -51.252369035380866], [44.27201963771408, -52.36521306416042], [48.95201963771407, -52.144840406423555], [54.89201963771408, -50.913144540177726], [53.99201963771408, -50.342232607823334], [50.21201963771408, -48.34903300283418], [46.072019637714085, -45.649097025911615], [41.93201963771408, -43.20731892279515], [40.13201963771408, -43.20731892279515], [39.41201963771408, -41.47792893032508], [39.77201963771408, -40.93625400941078], [41.03201963771408, -37.73516661100703], [41.03201963771408, -35.86159248853735], [40.31201963771408, -32.73971110874484], [39.95201963771408, -30.129199505718255], [40.67201963771408, -27.766809159242847], [41.03201963771408, -25.51456030407079], [41.57201963771408, -22.72207460567469], [41.93201963771408, -21.3874862942931], [42.65201963771408, -19.362764947866392], [43.19201963771408, -16.45138090006267], [44.45201963771408, -14.891658303061831], [47.512019637714076, -11.915380389417521], [51.652019637714076, -10.325853519501429], [53.27201963771408, -10.325853519501429], [55.612019637714084, -11.209996907893391], [56.51201963771408, -12.794527658654102], [57.23201963771408, -15.239284293120757], [59.75201963771408, -17.14066047583975], [60.47201963771408, -19.192857827449444], [60.832019637714076, -20.71554564675517], [59.392019637714085, -22.555943979441086], [56.51201963771408, -24.372113547086226], [54.53201963771408, -25.676895878004046], [51.47201963771408, -26.162573665519297], [49.49201963771408, -26.485241560858114], [46.252019637714085, -26.485241560858114], [43.55201963771408, -27.127861138472593], [42.65201963771408, -28.56024287048448], [43.37201963771408, -30.28475786045233], [44.99201963771408, -30.595135054396586], [49.49201963771408, -31.058840939270894], [52.55201963771408, -31.979486171415992], [55.252019637714085, -31.979486171415992], [59.032019637714086, -31.67361338312317], [62.092019637714074, -30.28475786045233], [63.71201963771408, -28.402027599631147], [64.61201963771408, -26.324019992511875], [66.23201963771407, -23.7145876239913], [67.49201963771408, -22.223082931580283], [70.01201963771408, -20.040611621220304], [71.99201963771407, -19.362764947866392], [80.27201963771407, -21.219786101315332], [83.33201963771407, -22.888003759050296], [92.15201963771406, -25.18923070111106], [95.03201963771407, -25.51456030407079], [97.19201963771407, -25.83901062526733], [99.53201963771407, -25.83901062526733], [101.87201963771408, -26.807006582782872], [103.85201963771408, -27.287944655865548], ], ], }, }, { type: 'Feature', properties: { tag: 0, }, geometry: { type: 'Polygon', coordinates: [ [ [-130.14155195484344, 41.487852789997994], [-127.62155195484343, 38.735243900196615], [-126.54155195484343, 34.40039562665327], [-119.70155195484342, 29.51604704580354], [-120.06155195484342, 24.05586822694754], [-120.42155195484342, 16.636627408068616], [-125.10155195484343, 12.807445180662302], [-133.02155195484343, 10.69283846064234], [-140.5815519548434, 10.33888547136772], [-151.0215519548434, 9.274682926554696], [-157.5015519548434, 9.274682926554696], [-163.6215519548434, 10.33888547136772], [-168.66155195484342, 14.20757493167452], [-169.0215519548434, 18.69463666471829], [-161.82155195484341, 19.714518033992608], [-154.9815519548434, 20.053055799273157], [-149.94155195484342, 20.053055799273157], [-142.7415519548434, 21.399820305494853], [-137.3415519548434, 22.401860652003805], [-134.46155195484343, 25.363975339146023], [-133.74155195484343, 27.61915747808707], [-133.38155195484345, 31.070187942123784], [-133.38155195484345, 33.50455180308434], [-135.54155195484338, 37.030565467906975], [-136.6215519548434, 40.673783943733916], [-134.10155195484344, 42.55755864087888], [-129.06155195484342, 43.08565454615262], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [-172.50615582626656, 55.34243434639385], [-169.98615582626655, 54.20038591244901], [-167.28615582626657, 53.134004088291825], [-164.40615582626657, 52.69986877991642], [-158.82615582626656, 52.04048257113581], [-157.38615582626656, 52.26137207024882], [-154.32615582626656, 53.777070553393926], [-148.92615582626655, 54.9308716910839], [-144.60615582626656, 55.13718346847793], [-139.74615582626657, 54.72349621950162], [-137.22615582626656, 53.67056857138993], [-136.50615582626656, 52.91748045939428], [-135.06615582626657, 51.37122381573061], [-134.52615582626657, 48.95031924431624], [-141.36615582626658, 47.14560623008539], [-146.04615582626658, 46.529956284153286], [-150.00615582626656, 45.53023238384666], [-152.52615582626655, 44.38391877964576], [-149.46615582626654, 43.606989324387456], [-145.3261558262666, 43.996725597066074], [-142.26615582626658, 44.38391877964576], [-138.12615582626657, 44.64063424057393], [-136.50615582626656, 44.12607261455687], [-138.66615582626656, 42.95178171094831], [-140.28615582626657, 41.21528230148223], [-140.64615582626658, 40.12310508276906], [-143.52615582626657, 39.013096218969984], [-150.36615582626655, 39.847269909494095], [-154.32615582626656, 40.53476737563416], [-156.66615582626656, 40.80781269453842], [-157.92615582626655, 41.485527621370885], [-159.90615582626657, 43.47651233879425], [-161.52615582626657, 44.38391877964576], [-164.76615582626658, 45.53023238384666], [-168.72615582626656, 45.90724809972263], [-171.6061558262666, 46.40597956199291], [-175.38615582626656, 46.90019268814431], [-177.36615582626655, 47.389891975805455], [-181.32615582626656, 47.75420766579828], [-182.94615582626656, 49.53786382154116], [-182.94615582626656, 51.14593400232519], [-181.86615582626658, 51.59541051492459], [-177.90615582626657, 52.04048257113581], [-174.84615582626657, 52.26137207024882], [-174.30615582626655, 53.88330295898747], [-173.58615582626655, 54.41043257369123], [-169.62615582626654, 53.777070553393926], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [-176.07088311754558, 4.18128369690307], [-167.25088311754558, 4.001742525864652], [-160.05088311754557, 3.8221619876893485], [-153.03088311754559, 3.1034813083974813], [-142.05088311754557, 3.1034813083974813], [-129.81088311754561, 3.8221619876893485], [-121.35088311754559, 4.5402409237908525], [-112.17088311754559, 4.8990196614667525], [-103.7108831175456, 4.8990196614667525], [-97.23088311754559, 4.7196534778764585], [-97.0508831175456, 1.6647657095836046], [-99.3908831175456, 0.40499662741323594], [-109.47088311754561, -0.6749843865191815], [-117.3908831175456, -0.1349998750880066], [-127.8308831175456, -1.2149089492561047], [-139.35088311754558, -2.4742306453876037], [-146.19088311754558, -2.654050349046777], [-153.75088311754558, -2.4742306453876037], [-161.85088311754558, -3.1933454548167752], [-181.83088311754557, -4.091518141944044], [-188.13088311754555, -3.911957067970923], [-190.65088311754556, -3.911957067970923], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [-109.72377930989475, -6.864583031183886], [-109.72377930989475, -9.886339889652158], [-110.23289619234906, -12.88058126410963], [-120.16067540020818, -13.1286105805478], [-125.5064026659785, -13.87118002383533], [-133.90683122647468, -15.839470812020899], [-143.58005199310662, -16.816623081160838], [-150.19857146501272, -16.57279474285029], [-156.05341561323735, -16.32865721661694], [-160.380909114099, -16.32865721661694], [-169.2904545570495, -17.303336147582815], [-182.52749350086165, -18.755642700353825], [-187.10954544295046, -18.755642700353825], [-187.36410388417767, -16.328657216616953], [-187.87322076663196, -11.636836918184239], [-180.49102597104442, -10.387507738297469], [-171.0723636456396, -9.38440687304756], [-162.41737664391624, -9.38440687304756], [-156.3079740544645, -10.63779311365978], [-150.70768834746704, -9.38440687304756], [-146.38019484660535, -7.117248736934226], [-135.4341818738376, -6.105800092688066], [-128.30654551947723, -6.611783118051768], [-119.90611695898103, -6.864583031183899], [-114.30583125198358, -6.358853850158493], [-111.760246839712, -7.117248736934226], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [134.6399999999999, 31.378910234671093], [137.3399999999999, 29.829723848055544], [140.03999999999988, 28.25614268373171], [143.09999999999988, 26.336806064475294], [148.13999999999987, 25.52743448867543], [154.43999999999988, 26.175377515775377], [158.21999999999989, 28.57277231581671], [163.7999999999999, 30.297076350120893], [168.65999999999988, 31.838796881109623], [172.25999999999988, 33.3551816964893], [176.93999999999988, 35.28758247495691], [184.13999999999987, 35.14052192561266], [188.9999999999999, 34.69774528812064], [196.37999999999988, 33.65536166514395], [208.43999999999986, 34.40123674586063], [214.91999999999987, 33.65536166514395], [217.07999999999987, 30.91676121263639], [217.79999999999987, 29.04593329317167], [217.79999999999987, 25.689752597185187], [215.4599999999999, 24.875973191198213], [211.31999999999988, 25.36489647772582], [203.57999999999987, 25.36489647772582], [194.57999999999987, 25.52743448867543], [190.61999999999986, 25.52743448867543], [186.29999999999987, 25.52743448867543], [181.79999999999987, 24.056799094499745], [174.95999999999987, 24.056799094499745], [170.27999999999986, 24.385107715365283], [163.97999999999988, 24.221059191018384], [154.6199999999999, 24.221059191018384], [148.4999999999999, 23.562760202721808], [146.15999999999988, 21.90266698095504], [144.17999999999986, 19.715477686739817], [143.4599999999999, 17.326205097041328], [143.9999999999999, 15.079317648189894], [145.97999999999988, 13.334445138596656], [149.03999999999988, 10.33988832624169], [151.37999999999988, 9.985537095500659], [154.25999999999988, 9.453290107101685], [160.7399999999999, 8.030056033651276], [165.59999999999988, 7.673431677430143], [169.55999999999986, 6.959298613790119], [177.1199999999999, 6.244077429101832], [180.89999999999986, 5.886093119357858], [185.3999999999999, 5.169446146465593], [190.7999999999999, 5.169446146465593], [198.17999999999986, 5.348688350376266], [203.57999999999987, 4.810811249189112], [207.1799999999999, 4.990153198805038], [214.55999999999986, 4.451987323166235], [216.1799999999999, 2.835316057587929], [216.5399999999999, -0.763503437557864], [216.71999999999989, -4.3593140473212655], [216.71999999999989, -6.509477009041727], [214.91999999999987, -9.183944489941267], [210.59999999999988, -9.183944489941267], [200.3399999999999, -9.006207633751716], [196.01999999999987, -8.116245371958126], [190.97999999999988, -7.759695432021348], [188.81999999999988, -7.224307387597664], [184.6799999999999, -5.972679448979674], [173.87999999999988, -5.076869548228687], [163.25999999999988, -3.4614185602365626], [158.03999999999988, -1.303413598548794], [155.3399999999999, -1.303413598548794], [150.47999999999988, -1.303413598548794], [146.87999999999988, 0.6764582491983528], [144.53999999999988, 2.2958593352780157], [138.59999999999988, 3.3745213491036945], [136.79999999999987, 4.27250884199363], [132.2999999999999, 6.4229787374979], [129.9599999999999, 9.630799591803255], [129.4199999999999, 12.457154805983198], [127.25999999999989, 15.426635554092252], [126.7199999999999, 19.545939809662283], [126.1799999999999, 22.236288765329846], [125.81999999999991, 25.202139576221953], [128.15999999999988, 28.097473725496574], [131.0399999999999, 28.414575833557976], [132.1199999999999, 29.673450615949772], [132.8399999999999, 30.762212067556927], [133.9199999999999, 32.296402744763235], ], ], }, }, { type: 'Feature', properties: { tag: 1, }, geometry: { type: 'Polygon', coordinates: [ [ [170.28, -7.680034342485665], [165.96, -9.10457644896707], [163.8, -11.583413797174545], [164.16, -14.737874832725488], [169.56, -15.085750519049595], [176.76, -15.77978485837467], [183.6, -16.471451602777506], [195.48000000000002, -16.81636819465469], [200.52, -17.847314598653416], [206.27999999999997, -18.18965841607815], [210.6, -19.212621924125884], [213.84, -20.229260218635044], [213.11999999999998, -24.555003592763217], [210.23999999999998, -26.181356498957065], [205.92, -26.181356498957065], [203.04, -26.181356498957065], [193.32000000000002, -24.555003592763217], [186.48000000000002, -24.555003592763217], [182.52, -24.555003592763217], [175.68, -24.227134929422462], [168.48, -24.227134929422462], [167.39999999999998, -25.208167619460696], [167.76, -27.466368852687243], [170.64, -29.05175758316002], [176.76, -29.67923912839639], [182.88, -29.67923912839639], [187.92000000000002, -30.302828619063934], [192.24, -30.613148364725053], [198.00000000000003, -30.613148364725053], [199.44000000000003, -30.613148364725053], [205.55999999999997, -30.613148364725053], [206.64, -30.613148364725053], [210.95999999999998, -30.613148364725053], [212.04, -32.45405014347484], [212.39999999999998, -34.55511027365949], [215.64, -36.604421032488844], [215.64, -38.318805748703376], [212.04, -40.268835004085254], [207.35999999999999, -40.54296412840765], [204.48, -40.268835004085254], [198.36, -39.717231865179485], [191.52, -39.43976163736511], [190.44, -38.318805748703376], [185.04, -34.55511027365949], [179.64, -33.059546861378], [176.04, -31.230808081046085], [167.39999999999998, -32.45405014347484], [165.96, -36.02426454607497], [164.88, -40.815975948512936], [163.08, -42.43050026507675], [159.12, -46.784448733032534], [155.88, -49.193225151181196], [149.4, -51.03965717355778], [141.84, -51.03965717355778], [143.64000000000001, -48.95740184917345], [147.96, -46.28917406412129], [151.56, -45.28506425886305], [154.8, -41.89681940612848], [154.8, -39.161181680995405], [156.24, -36.02426454607497], [158.4, -32.75731312775746], [159.48, -29.05175758316002], [159.84, -25.533446326893493], [169.92, -23.568866946546752], [173.51999999999998, -20.903366925329127], [176.76, -20.903366925329127], [183.6, -18.18965841607815], [181.44, -17.16065838658008], [176.4, -16.125919993329756], [169.2, -17.16065838658008], [161.28, -17.847314598653416], [155.88, -17.847314598653416], [152.28, -16.81636819465469], [151.2, -14.389442653592273], [151.92, -13.690956979615194], [158.4, -13.690956979615194], [169.56, -14.737874832725488], [169.2, -11.583413797174545], [162.72, -9.814780735643414], [159.48, -8.392958596110796], [162, -6.96591185837853], [176.4, -10.169319596339863], [182.52, -11.230525435795052], [186.48000000000002, -13.690956979615194], ], ], }, }], }; @Injectable() export class Service { getStreamsData(): FeatureCollection { return streamsData; } }
// In real applications, you should not transpile code in the browser. // You can see how to create your own application with Angular and DevExtreme here: // https://js.devexpress.com/Documentation/Guide/Angular_Components/Getting_Started/Create_a_DevExtreme_Application/ const componentNames = [ 'accordion', 'action-sheet', 'autocomplete', 'bar-gauge', 'box', 'bullet', 'button-group', 'button', 'calendar', 'chart', 'check-box', 'circular-gauge', 'color-box', 'context-menu', 'data-grid', 'date-box', 'date-range-box', 'defer-rendering', 'diagram', 'draggable', 'drawer', 'drop-down-box', 'drop-down-button', 'file-manager', 'file-uploader', 'filter-builder', 'form', 'funnel', 'gallery', 'gantt', 'html-editor', 'linear-gauge', 'list', 'load-indicator', 'load-panel', 'lookup', 'map', 'menu', 'multi-view', 'nested', 'number-box', 'pie-chart', 'pivot-grid-field-chooser', 'pivot-grid', 'polar-chart', 'popover', 'popup', 'progress-bar', 'radio-group', 'range-selector', 'range-slider', 'recurrence-editor', 'resizable', 'responsive-box', 'sankey', 'scheduler', 'scroll-view', 'select-box', 'slider', 'sortable', 'sparkline', 'speed-dial-action', 'splitter', 'switch', 'tab-panel', 'tabs', 'tag-box', 'text-area', 'text-box', 'tile-view', 'toast', 'toolbar', 'tooltip', 'tree-list', 'tree-map', 'tree-view', 'validation-group', 'validation-summary', 'validator', 'vector-map', ]; window.exports = window.exports || {}; window.config = { transpiler: 'ts', typescriptOptions: { module: 'system', emitDecoratorMetadata: true, experimentalDecorators: true, }, meta: { 'typescript': { 'exports': 'ts', }, 'devextreme-dist/js/vectormap-data/*': { 'esModule': true, }, 'devextreme/time_zone_utils.js': { 'esModule': true, }, 'devextreme/localization.js': { 'esModule': true, }, 'devextreme/viz/palette.js': { 'esModule': true, }, '@angular/platform-browser-dynamic': { 'esModule': true, }, '@angular/platform-browser': { 'esModule': true, }, '@angular/core': { 'esModule': true, }, '@angular/common': { 'esModule': true, }, '@angular/common/http': { 'esModule': true, }, '@angular/compiler': { 'esModule': true, }, '@angular/animations': { 'esModule': true, }, '@angular/forms': { 'esModule': true, }, }, paths: { 'npm:': 'https://unpkg.com/', 'bundles:': '../../../../bundles/', }, map: { 'ts': 'npm:plugin-typescript@4.2.4/lib/plugin.js', 'typescript': 'npm:typescript@4.2.4/lib/typescript.js', /* @angular */ '@angular/compiler': 'bundles:@angular/compiler.umd.js', '@angular/platform-browser-dynamic': 'bundles:@angular/platform-browser-dynamic.umd.js', '@angular/core': 'bundles:@angular/core.umd.js', '@angular/core/primitives/signals': 'bundles:@angular/core.primitives.signals.umd.js', '@angular/common': 'bundles:@angular/common.umd.js', '@angular/common/http': 'bundles:@angular/common-http.umd.js', '@angular/platform-browser': 'bundles:@angular/platform-browser.umd.js', '@angular/platform-browser/animations': 'bundles:@angular/platform-browser.umd.js', '@angular/forms': 'bundles:@angular/forms.umd.js', /* devextreme */ 'devextreme': 'npm:devextreme@24.1.7/cjs', '@devextreme/runtime': 'npm:@devextreme/runtime@3.0.13', 'devextreme/bundles/dx.all': 'npm:devextreme@24.1.7/bundles/dx.all.js', 'devextreme-quill': 'npm:devextreme-quill@1.7.1/dist/dx-quill.min.js', 'devexpress-diagram': 'npm:devexpress-diagram@2.2.13', 'devexpress-gantt': 'npm:devexpress-gantt@4.1.56', /* devextreme-angular umd maps */ 'devextreme-angular': 'bundles:devextreme-angular/devextreme-angular.umd.js', 'devextreme-angular/core': 'bundles:devextreme-angular/devextreme-angular-core.umd.js', 'devextreme-angular/http': 'bundles:devextreme-angular/devextreme-angular-http.umd.js', ...componentNames.reduce((acc, name) => { acc[`devextreme-angular/ui/${name}`] = `bundles:devextreme-angular/devextreme-angular-ui-${name}.umd.js`; return acc; }, {}), 'jszip': 'npm:jszip@3.10.1/dist/jszip.min.js', 'tslib': 'npm:tslib@2.6.1/tslib.js', 'rxjs': 'npm:rxjs@7.5.3/dist/bundles/rxjs.umd.js', 'rxjs/operators': 'npm:rxjs@7.5.3/dist/cjs/operators/index.js', 'devextreme-dist/js/vectormap-data': 'npm:devextreme-dist@24.1.7/js/vectormap-data', 'rrule': 'npm:rrule@2.6.4/dist/es5/rrule.js', 'luxon': 'npm:luxon@1.28.1/build/global/luxon.min.js', 'es6-object-assign': 'npm:es6-object-assign@1.1.0', '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@7.4.11/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', // Prettier 'prettier/standalone': 'npm:prettier@2.8.8/standalone.js', 'prettier/parser-html': 'npm:prettier@2.8.8/parser-html.js', }, packages: { 'app': { main: './app.component.ts', defaultExtension: 'ts', }, 'devextreme': { defaultExtension: 'js', }, 'devextreme/events/utils': { main: 'index', }, 'devextreme/events': { main: 'index', }, 'es6-object-assign': { main: './index.js', defaultExtension: 'js', }, 'rxjs': { defaultExtension: 'js', }, 'rxjs/operators': { defaultExtension: 'js', }, }, packageConfigPaths: [ 'npm:@devextreme/*/package.json', 'npm:@devextreme/runtime@3.0.13/inferno/package.json', 'npm:rxjs@7.5.3/package.json', 'npm:rxjs@7.5.3/operators/package.json', 'npm:devexpress-diagram@2.2.13/package.json', 'npm:devexpress-gantt@4.1.56/package.json', ], }; System.config(window.config); // System.import('@angular/compiler').catch(console.error.bind(console));
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" 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.1.7/css/dx.light.css" /> <script src="https://unpkg.com/core-js@2.6.12/client/shim.min.js"></script> <script src="https://unpkg.com/zone.js@0.13.3/bundles/zone.umd.min.js"></script> <script src="https://unpkg.com/reflect-metadata@0.1.13/Reflect.js"></script> <script src="https://unpkg.com/systemjs@0.21.3/dist/system.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script>window.jQuery || document.write(decodeURIComponent('%3Cscript src="js/jquery.min.js"%3E%3C/script%3E'))</script> <script src="config.js"></script> <script> System.import("app").catch(console.error.bind(console)); </script> </head> <body class="dx-viewport"> <div class="demo-container"> <demo-app>Loading...</demo-app> </div> </body> </html>