@syncfusion/ej2-maps 19.3.44 → 19.4.42

package/src/maps/layers/legend.js

@@ -1,5 +1,5 @@
 import { click, legendRendering } from '../index';
-import { Rect, measureText, PathOption, textTrim, removeClass, querySelector, getTemplateFunction, maintainStyleClass, getValueFromObject } from '../utils/helper';
+import { Rect, measureText, PathOption, textTrim, drawBalloon, removeClass, querySelector, getTemplateFunction, maintainStyleClass, getValueFromObject } from '../utils/helper';
 import { RectOption, Size, TextOption, Point, renderTextElement, drawSymbol, checkPropertyPath, getElement } from '../utils/helper';
 import { isNullOrUndefined, Browser, EventHandler, remove, extend } from '@syncfusion/ej2-base';
 /**
@@ -422,6 +422,7 @@ var Legend = /** @class */ (function () {
         var textOptions;
         var renderOptions;
         var render = map.renderer;
+        var legendShape = legend.shape;
         if (page >= 0 && page < this.totalPages.length) {
             if (querySelector(this.legendGroup.id, this.maps.element.id)) {
                 remove(querySelector(this.legendGroup.id, this.maps.element.id));
@@ -446,21 +447,35 @@ var Legend = /** @class */ (function () {
                 var textLocation = collection['Text'];
                 var imageUrl = ((isNullOrUndefined(collection['ImageSrc'])) ? legend.shape : collection['ImageSrc']);
                 var renderOptions_1 = new PathOption(shapeId, collection['Fill'], strokeWidth, strokeColor, legend.opacity, isNullOrUndefined(shapeBorder.opacity) ? legend.opacity : shapeBorder.opacity, '');
-                legend.textStyle.color = (legend.textStyle.color !== null) ? legend.textStyle.color :
+                var legendTextStyle = {
+                    fontFamily: legend.textStyle.fontFamily, fontStyle: legend.textStyle.fontStyle,
+                    fontWeight: legend.textStyle.fontWeight, size: legend.textStyle.size, color: legend.textStyle.color, opacity: legend.textStyle.opacity
+                };
+                legendTextStyle.color = (legendTextStyle.color !== null) ? legendTextStyle.color :
                     this.maps.themeStyle.legendTextColor;
-                legend.textStyle.fontFamily = map.themeStyle.fontFamily || legend.textStyle.fontFamily;
-                legend.textStyle.size = map.themeStyle.legendFontSize || legend.textStyle.size;
+                legendTextStyle.fontFamily = map.themeStyle.fontFamily || legendTextStyle.fontFamily;
+                legendTextStyle.size = map.themeStyle.legendFontSize || legendTextStyle.size;
                 if (i === 0) {
                     this.renderLegendBorder();
                 }
-                legendElement.appendChild(drawSymbol(shapeLocation, shape, shapeSize, collection['ImageSrc'], renderOptions_1));
+                if (legend.type === 'Markers' && legend.useMarkerShape) {
+                    var legendShapeData = this.legendCollection[collection['idIndex']].data[0];
+                    var marker = map.layers[legendShapeData['layerIndex']].markerSettings[legendShapeData['markerIndex']];
+                    legendShape = !isNullOrUndefined(marker.dataSource[legendShapeData['dataIndex']][marker['shapeValuePath']]) && marker.dataSource[legendShapeData['dataIndex']][marker['shapeValuePath']] !== '' ? marker.dataSource[legendShapeData['dataIndex']][marker['shapeValuePath']] : marker.shape;
+                }
+                if (legendShape === "Balloon") {
+                    legendElement.appendChild(drawBalloon(map, renderOptions_1, shapeSize, { x: shapeLocation.x, y: (shapeLocation.y + 5) }, 'Legend'));
+                }
+                else {
+                    legendElement.appendChild(drawSymbol(shapeLocation, legendShape, shapeSize, collection['ImageSrc'], renderOptions_1));
+                }
                 var legendRectSize = collection['Rect']['x'] + collection['Rect']['width'];
                 if (legendRectSize > this.legendBorderRect.width) {
-                    var trimmedText = this.legendTextTrim(this.legendBorderRect.width, legendText, legend.textStyle, legendRectSize);
+                    var trimmedText = this.legendTextTrim(this.legendBorderRect.width, legendText, legendTextStyle, legendRectSize);
                     legendText = trimmedText;
                 }
                 textOptions = new TextOption(textId, textLocation.x, textLocation.y, 'start', legendText, '', '');
-                renderTextElement(textOptions, legend.textStyle, legend.textStyle.color, legendElement);
+                renderTextElement(textOptions, legendTextStyle, legendTextStyle.color, legendElement);
                 this.legendGroup.appendChild(legendElement);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 if (i === (this.totalPages[page]['Collection'].length - 1)) {
@@ -528,7 +543,7 @@ var Legend = /** @class */ (function () {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var collection = this.maps.legendModule.legendCollection;
         var length;
-        var multiSelectEnable = this.maps.layers[collection[0]['data'][0]['layerIndex']].selectionSettings.enableMultiSelect;
+        var multiSelectEnable = !isNullOrUndefined(collection[0]['data'][0]['layerIndex']) ? this.maps.layers[collection[0]['data'][0]['layerIndex']].selectionSettings.enableMultiSelect : false;
         var selectLength = 0;
         var interactProcess = true;
         var idIndex = parseFloat(targetElement.id.charAt(targetElement.id.length - 1));
@@ -1141,7 +1156,10 @@ var Legend = /** @class */ (function () {
         var map = this.maps;
         var legend = map.legendSettings;
         var legendTitle = legend.title.text;
-        var textStyle = legend.titleStyle;
+        var textStyle = {
+            fontFamily: legend.titleStyle.fontFamily, fontStyle: legend.titleStyle.fontStyle,
+            fontWeight: legend.titleStyle.fontWeight, size: legend.titleStyle.size, color: legend.titleStyle.color, opacity: legend.titleStyle.opacity
+        };
         var textOptions;
         var spacing = 10;
         var trimTitle = textTrim((this.legendItemRect.width + (spacing * 2)), legendTitle, textStyle);
@@ -1160,6 +1178,7 @@ var Legend = /** @class */ (function () {
         map.svgObject.appendChild(this.legendGroup);
         if (legendTitle) {
             textStyle.color = (textStyle.color !== null) ? textStyle.color : this.maps.themeStyle.legendTitleFontColor;
+            textStyle.fontFamily = !isNullOrUndefined(textStyle.fontFamily) ? textStyle.fontFamily : this.maps.themeStyle.fontFamily;
             textOptions = new TextOption(map.element.id + '_LegendTitle', (this.legendItemRect.x) + (this.legendItemRect.width / 2), this.legendItemRect.y - (textSize.height / 2) - spacing / 2, 'middle', trimTitle, '');
             renderTextElement(textOptions, textStyle, textStyle.color, this.legendGroup);
         }
@@ -1268,21 +1287,25 @@ var Legend = /** @class */ (function () {
                     }
                     else {
                         newData.push({ layerIndex: layerIndex, markerIndex: markerIndex, dataIndex: dataIndex, value: legendFill, name: text,
-                            shape: !isNullOrUndefined(marker.shapeValuePath) ? data[marker.shapeValuePath] : marker.shape });
+                            shape: (!isNullOrUndefined(marker.shapeValuePath) && !isNullOrUndefined(data[marker.shapeValuePath]) && data[marker.shapeValuePath] !== '') ? data[marker.shapeValuePath] : (_this.maps.legendSettings.useMarkerShape ? marker.shape : _this.maps.legendSettings.shape) });
                         _this.getOverallLegendItemsCollection(text, legendFill, newData, showLegend);
                     }
                 }
             });
         });
     };
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     Legend.prototype.getMarkerLegendData = function (layerIndex, text, legendFill) {
         var _this = this;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var legendData = [];
         this.maps.layers[layerIndex].markerSettings.map(function (markerSettings, markerIndex) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
             var markerData = markerSettings.dataSource;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
             Array.prototype.forEach.call(markerData, function (data, dataIndex) {
                 var marker = _this.maps.layers[layerIndex].markerSettings[markerIndex];
-                if ((text === data[marker.legendText] || text === '') && legendFill == data[marker.colorValuePath]) {
+                if ((text === data[marker.legendText] || text === '') && legendFill === data[marker.colorValuePath]) {
                     legendData.push({ layerIndex: layerIndex, markerIndex: markerIndex, dataIndex: dataIndex, value: legendFill, name: text,
                         shape: !isNullOrUndefined(marker.shapeValuePath) ? data[marker.shapeValuePath] : marker.shape });
                 }
@@ -1650,7 +1673,7 @@ var Legend = /** @class */ (function () {
                             shape = this.legendCollection[legendIndex]['data'][i];
                             mapElement = this.maps.legendSettings.type === 'Bubbles' ? querySelector(this.maps.element.id + '_LayerIndex_' + shape['layerIndex'] +
                                 '_BubbleIndex_' + j + '_dataIndex_' + shape['dataIndex'], this.maps.element.id) : querySelector(this.maps.element.id + '_LayerIndex_' + shape['layerIndex'] +
-                                '_MarkerIndex_' + j + '_dataIndex_' + shape['dataIndex'], this.maps.element.id);
+                                '_MarkerIndex_' + shape['markerIndex'] + '_dataIndex_' + shape['dataIndex'], this.maps.element.id);
                             if (!isNullOrUndefined(shape['shape']) && shape['shape'] === 'Balloon') {
                                 mapElement = mapElement.children[0];
                             }
@@ -1659,7 +1682,7 @@ var Legend = /** @class */ (function () {
                                     mapElement.setAttribute('fill', this.maps.layers[k].shapeSettings.fill);
                                     mapElement.setAttribute('stroke', this.maps.layers[k].shapeSettings.border.color);
                                     mapElement.setAttribute('fill-opacity', (this.maps.layers[k].shapeSettings.opacity).toString());
-                                    mapElement.setAttribute('stroke-width', (this.maps.layers[k].shapeSettings.border.width).toString());
+                                    mapElement.setAttribute('stroke-width', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width).toString());
                                     mapElement.setAttribute('stroke-opacity', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ?
                                         this.maps.layers[k].shapeSettings.opacity :
                                         this.maps.layers[k].shapeSettings.border.opacity).toString());
@@ -1674,6 +1697,9 @@ var Legend = /** @class */ (function () {
                                 if (targetEle !== null) {
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Shape_Index_' + legendIndex, this.maps.element.id);
                                     legendShapeId.setAttribute('fill', '#E5E5E5');
+                                    if (this.maps.legendSettings.shape === 'HorizontalLine' || this.maps.legendSettings.shape === 'VerticalLine' || this.maps.legendSettings.shape === 'Cross') {
+                                        legendShapeId.setAttribute('stroke', '#E5E5E5');
+                                    }
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
                                     legendTextId.setAttribute('fill', '#E5E5E5');
                                 }
@@ -1688,6 +1714,9 @@ var Legend = /** @class */ (function () {
                                 if (targetEle !== null) {
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Shape_Index_' + legendIndex, this.maps.element.id);
                                     legendShapeId.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
+                                    if (this.maps.legendSettings.shape === 'HorizontalLine' || this.maps.legendSettings.shape === 'VerticalLine' || this.maps.legendSettings.shape === 'Cross') {
+                                        legendShapeId.setAttribute('stroke', this.legendCollection[legendIndex]['fill']);
+                                    }
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
                                     legendTextId.setAttribute('fill', '#757575');
                                 }
@@ -1722,7 +1751,7 @@ var Legend = /** @class */ (function () {
                                     layerElement.setAttribute('fill', this.maps.layers[j].shapeSettings.fill);
                                     layerElement.setAttribute('fill-opacity', (this.maps.layers[j].shapeSettings.opacity).toString());
                                     layerElement.setAttribute('stroke', this.maps.layers[j].shapeSettings.border.color);
-                                    layerElement.setAttribute('stroke-width', (this.maps.layers[j].shapeSettings.border.width).toString());
+                                    layerElement.setAttribute('stroke-width', (isNullOrUndefined(this.maps.layers[j].shapeSettings.border.width) ? 0 : this.maps.layers[j].shapeSettings.border.width).toString());
                                     layerElement.setAttribute('stroke-opacity', (isNullOrUndefined(this.maps.layers[j].shapeSettings.border.opacity) ?
                                         this.maps.layers[j].shapeSettings.opacity :
                                         this.maps.layers[j].shapeSettings.border.opacity).toString());
@@ -1752,7 +1781,7 @@ var Legend = /** @class */ (function () {
                                 layerElement.setAttribute('stroke-opacity', (isNullOrUndefined(this.maps.layers[j].shapeSettings.border.opacity) ?
                                     this.maps.layers[j].shapeSettings.opacity :
                                     this.maps.layers[j].shapeSettings.border.opacity).toString());
-                                layerElement.setAttribute('stroke-width', (this.maps.layers[j].shapeSettings.border.width).toString());
+                                layerElement.setAttribute('stroke-width', (isNullOrUndefined(this.maps.layers[j].shapeSettings.border.width) ? 0 : this.maps.layers[j].shapeSettings.border.width).toString());
                                 layerElement.setAttribute('fill-opacity', (this.maps.layers[j].shapeSettings.opacity).toString());
                                 layerElement.setAttribute('stroke', this.maps.layers[j].shapeSettings.border.color);
                                 if (targetEle !== null) {
@@ -1772,7 +1801,7 @@ var Legend = /** @class */ (function () {
             targetEle.id.indexOf(this.maps.element.id + '_Legend_Index') !== -1) && this.maps.legendSettings.visible &&
             targetEle.id.indexOf('_Text') === -1) {
             var LegendInteractive = void 0;
-            var legendIndex = parseFloat(targetEle.id.substr((this.maps.element.id + '_Legend_Index_').length));
+            var legendIndex = parseFloat(targetEle.id.split(this.maps.element.id + '_Legend_Index_')[1]);
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             var mapdata = void 0;
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -1793,7 +1822,7 @@ var Legend = /** @class */ (function () {
                                 if (this.maps.legendSettings.toggleLegendSettings.applyShapeSettings) {
                                     LegendInteractive.setAttribute('fill', this.maps.layers[k].shapeSettings.fill);
                                     LegendInteractive.setAttribute('stroke', this.maps.layers[k].shapeSettings.border.color);
-                                    LegendInteractive.setAttribute('stroke-width', (this.maps.layers[k].shapeSettings.border.width).toString());
+                                    LegendInteractive.setAttribute('stroke-width', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width).toString());
                                     LegendInteractive.setAttribute('stroke-opacity', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ?
                                         this.maps.layers[k].shapeSettings.opacity :
                                         this.maps.layers[k].shapeSettings.border.opacity).toString());
@@ -1857,7 +1886,7 @@ var Legend = /** @class */ (function () {
                                     mapLegendElement.setAttribute('fill', this.maps.layers[0].shapeSettings.fill);
                                     mapLegendElement.setAttribute('stroke', this.maps.layers[0].shapeSettings.border.color);
                                     mapLegendElement.setAttribute('fill-opacity', (this.maps.layers[k].shapeSettings.opacity).toString());
-                                    mapLegendElement.setAttribute('stroke-width', (this.maps.layers[k].shapeSettings.border.width).toString());
+                                    mapLegendElement.setAttribute('stroke-width', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width).toString());
                                     mapLegendElement.setAttribute('stroke-opacity', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ?
                                         this.maps.layers[k].shapeSettings.opacity :
                                         this.maps.layers[k].shapeSettings.border.opacity).toString());
@@ -1884,7 +1913,7 @@ var Legend = /** @class */ (function () {
                                     this.maps.toggledShapeElementId.splice(toggledShapeIdIndex, 1);
                                 }
                                 mapLegendElement.setAttribute('fill-opacity', (this.maps.layers[k].shapeSettings.opacity).toString());
-                                mapLegendElement.setAttribute('stroke-width', (this.maps.layers[k].shapeSettings.border.width).toString());
+                                mapLegendElement.setAttribute('stroke-width', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width).toString());
                                 mapLegendElement.setAttribute('stroke', this.maps.layers[0].shapeSettings.border.color);
                                 mapLegendElement.setAttribute('stroke-opacity', (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ?
                                     this.maps.layers[k].shapeSettings.opacity : this.maps.layers[k].shapeSettings.border.opacity).toString());

package/src/maps/layers/marker.js

@@ -1,12 +1,3 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
-    return t;
-};
 import { markerRendering, convertTileLatLongToPoint, MapLocation } from '../index';
 import { markerClick, markerMouseMove, markerClusterClick, markerClusterMouseMove } from '../index';
 import { isNullOrUndefined, createElement } from '@syncfusion/ej2-base';
@@ -57,15 +48,9 @@ var Marker = /** @class */ (function () {
                     border: markerSettings.border, colorValuePath: markerSettings.colorValuePath,
                     shapeValuePath: markerSettings.shapeValuePath, imageUrlValuePath: markerSettings.imageUrlValuePath
                 };
-                eventArgs = markerColorChoose(eventArgs, data);
-                eventArgs = markerShapeChoose(eventArgs, data);
                 _this.maps.trigger('markerRendering', eventArgs, function (MarkerArgs) {
-                    if (markerSettings.colorValuePath !== eventArgs.colorValuePath) {
-                        eventArgs = markerColorChoose(eventArgs, data);
-                    }
-                    if (markerSettings.shapeValuePath !== eventArgs.shapeValuePath) {
-                        eventArgs = markerShapeChoose(eventArgs, data);
-                    }
+                    eventArgs = markerColorChoose(eventArgs, data);
+                    eventArgs = markerShapeChoose(eventArgs, data);
                     var lng = (!isNullOrUndefined(markerSettings.longitudeValuePath)) ?
                         Number(getValueFromObject(data, markerSettings.longitudeValuePath)) : !isNullOrUndefined(data['longitude']) ?
                         parseFloat(data['longitude']) : !isNullOrUndefined(data['Longitude']) ? parseFloat(data['Longitude']) : 0;
@@ -295,10 +280,6 @@ var Marker = /** @class */ (function () {
             longitude: options.data['longitude'] || options.data['Longitude'],
             value: options.data['name']
         };
-        if (this.maps.isBlazor) {
-            var maps = eventArgs.maps, marker_1 = eventArgs.marker, blazorEventArgs = __rest(eventArgs, ["maps", "marker"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger(markerClick, eventArgs);
     };
     /**
@@ -378,9 +359,6 @@ var Marker = /** @class */ (function () {
                     for (var _i = 0, indexes_1 = indexes; _i < indexes_1.length; _i++) {
                         var i = indexes_1[_i];
                         collection_1.push({ data: marker.dataSource[i], index: i });
-                        if (this.maps.isBlazor) {
-                            marker.dataSource[i]['text'] = '';
-                        }
                         markCollection.push(marker.dataSource[i]);
                     }
                     isClusterSame = false;

package/src/maps/maps-model.d.ts

@@ -1,4 +1,4 @@
-import { Component, NotifyPropertyChanges, INotifyPropertyChanged, Property, Ajax } from '@syncfusion/ej2-base';import { EventHandler, Browser, EmitType, isNullOrUndefined, createElement, setValue, extend } from '@syncfusion/ej2-base';import { Event, remove, L10n, Collection, Internationalization, Complex, isBlazor } from '@syncfusion/ej2-base';import { ModuleDeclaration, updateBlazorTemplate, resetBlazorTemplate } from '@syncfusion/ej2-base';import { SvgRenderer } from '@syncfusion/ej2-svg-base';import { Size, createSvg, Point, removeElement, triggerShapeEvent, showTooltip, checkShapeDataFields, MapLocation, getMousePosition } from './utils/helper';import { getElement, removeClass, getTranslate, triggerItemSelectionEvent, mergeSeparateCluster, customizeStyle } from './utils/helper';import { createStyle } from './utils/helper';import { ZoomSettings, LegendSettings, Tile } from './model/base';import { LayerSettings, TitleSettings, Border, Margin, MapsAreaSettings, Annotation, CenterPosition } from './model/base';import { ZoomSettingsModel, LegendSettingsModel, LayerSettingsModel, BubbleSettingsModel } from './model/base-model';import { MarkerSettingsModel, SelectionSettingsModel , InitialMarkerSelectionSettingsModel} from './model/base-model';import { TitleSettingsModel, BorderModel, MarginModel, CenterPositionModel, InitialShapeSelectionSettingsModel } from './model/base-model';import { MapsAreaSettingsModel, AnnotationModel } from './model/base-model';import { Bubble } from './layers/bubble';import { Legend } from './layers/legend';import { Marker } from './layers/marker';import { Highlight } from './user-interaction/highlight';import { Selection } from './user-interaction/selection';import { MapsTooltip } from './user-interaction/tooltip';import { Zoom } from './user-interaction/zoom';import { load, click, rightClick, loaded, doubleClick, resize, shapeSelected, itemSelection, zoomIn } from './model/constants';import { ProjectionType, MapsTheme, PanDirection, TooltipGesture } from './utils/enum';import { getThemeStyle } from './model/theme';import { BingMap } from './layers/bing-map';import { ILoadEventArgs, ILoadedEventArgs, IMouseEventArgs, IResizeEventArgs, ITooltipRenderEventArgs } from './model/interface';import { GeoPosition, ITooltipRenderCompleteEventArgs, ILegendRenderingEventArgs } from './model/interface';import { ILayerRenderingEventArgs, IShapeRenderingEventArgs, IMarkerRenderingEventArgs, IMarkerClickEventArgs } from './model/interface';import { IMarkerMoveEventArgs, ILabelRenderingEventArgs, IBubbleMoveEventArgs, IBubbleClickEventArgs } from './model/interface';import { IMarkerClusterClickEventArgs, IMarkerClusterMoveEventArgs, IMarkerClusterRenderingEventArgs } from './model/interface';import { ISelectionEventArgs, IShapeSelectedEventArgs, IMapPanEventArgs, IMapZoomEventArgs } from './model/interface';import { IBubbleRenderingEventArgs, IAnimationCompleteEventArgs, IPrintEventArgs, IThemeStyle } from './model/interface';import { LayerPanel } from './layers/layer-panel';import { GeoLocation, Rect, RectOption, measureText, getElementByID, MapAjax, processResult } from '../maps/utils/helper';import { findPosition, textTrim, TextOption, renderTextElement, convertGeoToPoint, calculateZoomLevel } from '../maps/utils/helper';import { Annotations } from '../maps/user-interaction/annotation';import { FontModel, DataLabel, MarkerSettings, IAnnotationRenderingEventArgs } from './index';import { NavigationLineSettingsModel, changeBorderWidth } from './index';import { NavigationLine } from './layers/navigation-selected-line';import { DataManager, Query } from '@syncfusion/ej2-data';import { ExportType } from '../maps/utils/enum';import { PdfPageOrientation } from '@syncfusion/ej2-pdf-export';import { Print } from './model/print';import { PdfExport } from './model/export-pdf';import { ImageExport } from './model/export-image';
+import { Component, NotifyPropertyChanges, INotifyPropertyChanged, Property, Ajax } from '@syncfusion/ej2-base';import { EventHandler, Browser, EmitType, isNullOrUndefined, createElement, setValue, extend } from '@syncfusion/ej2-base';import { Event, remove, L10n, Collection, Internationalization, Complex } from '@syncfusion/ej2-base';import { ModuleDeclaration } from '@syncfusion/ej2-base';import { SvgRenderer } from '@syncfusion/ej2-svg-base';import { Size, createSvg, Point, removeElement, triggerShapeEvent, showTooltip, checkShapeDataFields, MapLocation, getMousePosition, calculateSize } from './utils/helper';import { getElement, removeClass, getTranslate, triggerItemSelectionEvent, mergeSeparateCluster, customizeStyle } from './utils/helper';import { createStyle } from './utils/helper';import { ZoomSettings, LegendSettings, Tile } from './model/base';import { LayerSettings, TitleSettings, Border, Margin, MapsAreaSettings, Annotation, CenterPosition } from './model/base';import { ZoomSettingsModel, LegendSettingsModel, LayerSettingsModel, BubbleSettingsModel } from './model/base-model';import { MarkerSettingsModel, SelectionSettingsModel , InitialMarkerSelectionSettingsModel} from './model/base-model';import { TitleSettingsModel, BorderModel, MarginModel, CenterPositionModel, InitialShapeSelectionSettingsModel } from './model/base-model';import { MapsAreaSettingsModel, AnnotationModel } from './model/base-model';import { Bubble } from './layers/bubble';import { Legend } from './layers/legend';import { Marker } from './layers/marker';import { Highlight } from './user-interaction/highlight';import { Selection } from './user-interaction/selection';import { MapsTooltip } from './user-interaction/tooltip';import { Zoom } from './user-interaction/zoom';import { load, click, rightClick, loaded, doubleClick, resize, shapeSelected, itemSelection, zoomIn } from './model/constants';import { ProjectionType, MapsTheme, PanDirection, TooltipGesture } from './utils/enum';import { getThemeStyle } from './model/theme';import { BingMap } from './layers/bing-map';import { ILoadEventArgs, ILoadedEventArgs, IMouseEventArgs, IResizeEventArgs, ITooltipRenderEventArgs } from './model/interface';import { GeoPosition, ITooltipRenderCompleteEventArgs, ILegendRenderingEventArgs } from './model/interface';import { ILayerRenderingEventArgs, IShapeRenderingEventArgs, IMarkerRenderingEventArgs, IMarkerClickEventArgs } from './model/interface';import { IMarkerMoveEventArgs, ILabelRenderingEventArgs, IBubbleMoveEventArgs, IBubbleClickEventArgs } from './model/interface';import { IMarkerClusterClickEventArgs, IMarkerClusterMoveEventArgs, IMarkerClusterRenderingEventArgs } from './model/interface';import { ISelectionEventArgs, IShapeSelectedEventArgs, IMapPanEventArgs, IMapZoomEventArgs } from './model/interface';import { IBubbleRenderingEventArgs, IAnimationCompleteEventArgs, IPrintEventArgs, IThemeStyle } from './model/interface';import { LayerPanel } from './layers/layer-panel';import { GeoLocation, Rect, RectOption, measureText, getElementByID, MapAjax, processResult } from '../maps/utils/helper';import { findPosition, textTrim, TextOption, renderTextElement, convertGeoToPoint, calculateZoomLevel } from '../maps/utils/helper';import { Annotations } from '../maps/user-interaction/annotation';import { FontModel, DataLabel, MarkerSettings, IAnnotationRenderingEventArgs } from './index';import { NavigationLineSettingsModel, changeBorderWidth } from './index';import { NavigationLine } from './layers/navigation-selected-line';import { DataManager, Query } from '@syncfusion/ej2-data';import { ExportType } from '../maps/utils/enum';import { PdfPageOrientation } from '@syncfusion/ej2-pdf-export';import { Print } from './model/print';import { PdfExport } from './model/export-pdf';import { ImageExport } from './model/export-image';
 import {ComponentModel} from '@syncfusion/ej2-base';
 
 /**
@@ -155,7 +155,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when the map is on load.
      *
      * @event load
-     * @blazorProperty 'OnLoad'
      */
     load?: EmitType<ILoadEventArgs>;
 
@@ -163,7 +162,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the print gets started.
      *
      * @event beforePrint
-     * @blazorProperty 'OnPrint'
      */
     beforePrint?: EmitType<IPrintEventArgs>;
 
@@ -171,7 +169,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers after the maps gets rendered.
      *
      * @event loaded
-     * @blazorProperty 'Loaded'
      */
     loaded?: EmitType<ILoadedEventArgs>;
 
@@ -179,7 +176,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when clicking an element in maps.
      *
      * @event click
-     * @blazorProperty 'OnClick'
      */
     click?: EmitType<IMouseEventArgs>;
 
@@ -187,7 +183,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when performing the double click operation on an element in maps.
      *
      * @event doubleClick
-     * @blazorProperty 'OnDoubleClick'
      */
     doubleClick?: EmitType<IMouseEventArgs>;
 
@@ -195,7 +190,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when performing the right click operation on an element in maps.
      *
      * @event rightClick
-     * @blazorProperty 'OnRightClick'
      */
     rightClick?: EmitType<IMouseEventArgs>;
 
@@ -203,7 +197,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when resizing the maps.
      *
      * @event resize
-     * @blazorProperty 'Resizing'
      */
     resize?: EmitType<IResizeEventArgs>;
 
@@ -211,7 +204,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the maps tooltip gets rendered.
      *
      * @event tooltipRender
-     * @blazorProperty 'TooltipRendering'
      */
     tooltipRender?: EmitType<ITooltipRenderEventArgs>;
 
@@ -220,7 +212,6 @@ export interface MapsModel extends ComponentModel{
      *
      * @event legendRendering
 
-     * @blazorProperty 'LegendRendering'
      */
     legendRendering?: EmitType<ILegendRenderingEventArgs>;
 
@@ -229,7 +220,6 @@ export interface MapsModel extends ComponentModel{
      *
 
      * @event tooltipRenderComplete
-     * @blazorProperty 'TooltipRenderComplete'
      */
     tooltipRenderComplete?: EmitType<ITooltipRenderCompleteEventArgs>;
 
@@ -237,7 +227,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when clicking a shape in maps.
      *
      * @event shapeSelected
-     * @blazorProperty 'ShapeSelected'
      */
     shapeSelected?: EmitType<IShapeSelectedEventArgs>;
 
@@ -245,7 +234,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when clicking the shape on maps and before the selection is applied.
      *
      * @event itemSelection
-     * @blazorProperty 'OnItemSelect'
      */
     itemSelection?: EmitType<ISelectionEventArgs>;
 
@@ -253,7 +241,6 @@ export interface MapsModel extends ComponentModel{
      * Trigger when mouse move on the shape in maps and before the shape gets highlighted.
      *
      * @event itemHighlight
-     * @blazorProperty 'OnItemHighlight'
      */
     itemHighlight?: EmitType<ISelectionEventArgs>;
 
@@ -261,7 +248,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when mouse move on the shape in maps and before the shape gets highlighted.
      *
      * @event shapeHighlight
-     * @blazorProperty 'ShapeHighlighted'
      */
     shapeHighlight?: EmitType<IShapeSelectedEventArgs>;
 
@@ -269,7 +255,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the maps layer gets rendered.
      *
      * @event layerRendering
-     * @blazorProperty 'LayerRendering'
      */
     layerRendering?: EmitType<ILayerRenderingEventArgs>;
 
@@ -277,7 +262,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the maps shape gets rendered.
      *
      * @event shapeRendering
-     * @blazorProperty 'ShapeRendering'
      */
     shapeRendering?: EmitType<IShapeRenderingEventArgs>;
 
@@ -285,7 +269,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the maps marker gets rendered.
      *
      * @event markerRendering
-     * @blazorProperty 'MarkerRendering'
      */
     markerRendering?: EmitType<IMarkerRenderingEventArgs>;
 
@@ -300,7 +283,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when clicking on the maps marker element.
      *
      * @event markerClick
-     * @blazorProperty 'OnMarkerClick'
      */
     markerClick?: EmitType<IMarkerClickEventArgs>;
 
@@ -322,7 +304,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when moving the mouse over the marker element in maps.
      *
      * @event markerMouseMove
-     * @blazorProperty 'OnMarkerMouseMove'
      */
     markerMouseMove?: EmitType<IMarkerMoveEventArgs>;
 
@@ -330,7 +311,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the data-label gets rendered.
      *
      * @event dataLabelRendering
-     * @blazorProperty 'DataLabelRendering'
      */
     dataLabelRendering?: EmitType<ILabelRenderingEventArgs>;
 
@@ -338,7 +318,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the bubble element gets rendered on the map.
      *
      * @event bubbleRendering
-     * @blazorProperty 'BubbleRendering'
      */
     bubbleRendering?: EmitType<IBubbleRenderingEventArgs>;
 
@@ -346,7 +325,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when performing the click operation on the bubble element in maps.
      *
      * @event bubbleClick
-     * @blazorProperty 'OnBubbleClick'
      */
     bubbleClick?: EmitType<IBubbleClickEventArgs>;
 
@@ -354,7 +332,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers when hovering the mouse on the bubble element in maps.
      *
      * @event bubbleMouseMove
-     * @blazorProperty 'OnBubbleMouseMove'
      */
     bubbleMouseMove?: EmitType<IBubbleMoveEventArgs>;
 
@@ -362,7 +339,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers after the animation completed in the maps component.
      *
      * @event animationComplete
-     * @blazorProperty 'AnimationCompleted'
      */
     animationComplete?: EmitType<IAnimationCompleteEventArgs>;
 
@@ -370,7 +346,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before rendering the annotation in maps.
      *
      * @event annotationRendering
-     * @blazorProperty 'AnnotationRendering'
      */
     annotationRendering?: EmitType<IAnnotationRenderingEventArgs>;
 
@@ -378,7 +353,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before the zoom operations in the maps such as zoom in and zoom out.
      *
      * @event zoom
-     * @blazorProperty 'OnZoom'
      */
     zoom?: EmitType<IMapZoomEventArgs>;
 
@@ -386,7 +360,6 @@ export interface MapsModel extends ComponentModel{
      * Triggers before performing the panning operation.
      *
      * @event pan
-     * @blazorProperty 'OnPan'
      */
     pan?: EmitType<IMapPanEventArgs>;