@syncfusion/ej2-maps 19.2.60 → 19.3.53

package/dist/es6/ej2-maps.es2015.js

@@ -1,4 +1,4 @@
-import { Ajax, Animation, Browser, ChildProperty, Collection, Complex, Component, Event, EventHandler, Internationalization, L10n, NotifyPropertyChanges, Property, compile, createElement, extend, isBlazor, isNullOrUndefined, merge, print, remove, resetBlazorTemplate, setValue, updateBlazorTemplate } from '@syncfusion/ej2-base';
+import { Ajax, Animation, Browser, ChildProperty, Collection, Complex, Component, Event, EventHandler, Internationalization, L10n, NotifyPropertyChanges, Property, compile, createElement, extend, isNullOrUndefined, merge, print, remove, setValue } from '@syncfusion/ej2-base';
 import { SvgRenderer, Tooltip } from '@syncfusion/ej2-svg-base';
 import { DataManager, Query } from '@syncfusion/ej2-data';
 import { PdfBitmap, PdfDocument, PdfPageOrientation } from '@syncfusion/ej2-pdf-export';
@@ -571,7 +571,7 @@ function renderTextElement(option, style, color, parent, isMinus = false) {
         'opacity': style.opacity,
         'dominant-baseline': option.baseLine
     };
-    const text = typeof option.text === 'string' ? option.text : isMinus ? option.text[option.text.length - 1] : option.text[0];
+    const text = typeof option.text === 'string' || typeof option.text === 'number' ? option.text : isMinus ? option.text[option.text.length - 1] : option.text[0];
     let tspanElement;
     const renderer = new SvgRenderer('');
     let height;
@@ -1686,7 +1686,7 @@ function getRatioOfBubble(min, max, value, minValue, maxValue) {
  * @returns {any} - Specifies the object
  */
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-function findMidPointOfPolygon(points, type) {
+function findMidPointOfPolygon(points, type, geometryType) {
     if (!points.length) {
         return null;
     }
@@ -1701,14 +1701,14 @@ function findMidPointOfPolygon(points, type) {
     let ySum = 0;
     for (let i = min; i <= max - 1; i++) {
         startX = points[i].x;
-        startY = type === 'Mercator' ? points[i].y : -(points[i].y);
+        startY = type === 'Mercator' || geometryType === 'Normal' ? points[i].y : -(points[i].y);
         if (i === max - 1) {
             startX1 = points[0].x;
-            startY1 = type === 'Mercator' ? points[0].y : -(points[0].y);
+            startY1 = type === 'Mercator' || geometryType === 'Normal' ? points[0].y : -(points[0].y);
         }
         else {
             startX1 = points[i + 1].x;
-            startY1 = type === 'Mercator' ? points[i + 1].y : -(points[i + 1].y);
+            startY1 = type === 'Mercator' || geometryType === 'Normal' ? points[i + 1].y : -(points[i + 1].y);
         }
         sum = sum + Math.abs(((startX * startY1)) - (startX1 * startY));
         xSum = xSum + Math.abs(((startX + startX1) * (((startX * startY1) - (startX1 * startY)))));
@@ -1729,7 +1729,7 @@ function findMidPointOfPolygon(points, type) {
     let height = 0;
     for (let i = min; i <= max - 1; i++) {
         const point = points[i];
-        point.y = type === 'Mercator' ? point.y : -(point.y);
+        point.y = type === 'Mercator' || geometryType === 'Normal' ? point.y : -(point.y);
         if (point.y > ySum) {
             if (point.x < xSum && xSum - point.x < xSum - bottomMinPoint.x) {
                 bottomMinPoint = { x: point.x, y: point.y };
@@ -3303,7 +3303,6 @@ var BootstrapTheme;
  * @param {MapsTheme} theme Specifies the theme of the maps
  * @returns {string[]} Returns the shape color
  */
-// eslint-disable-next-line @typescript-eslint/no-namespace
 function getShapeColor(theme) {
     let themePalette;
     switch (theme.toLowerCase()) {
@@ -3315,6 +3314,14 @@ function getShapeColor(theme) {
             themePalette = ['#10B981', '#22D3EE', '#2DD4BF', '#4ADE80', '#8B5CF6',
                 '#E879F9', '#F472B6', '#F87171', '#F97316', '#FCD34D'];
             break;
+        case 'bootstrap5':
+            themePalette = ['#262E0B', '#668E1F', '#AF6E10', '#862C0B', '#1F2D50',
+                '#64680B', '#311508', '#4C4C81', '#0C7DA0', '#862C0B'];
+            break;
+        case 'bootstrap5dark':
+            themePalette = ['#5ECB9B', '#A860F1', '#EBA844', '#557EF7', '#E9599B',
+                '#BFC529', '#3BC6CF', '#7A68EC', '#74B706', '#EA6266'];
+            break;
         default:
             themePalette = ['#B5E485', '#7BC1E8', '#DF819C', '#EC9B79', '#78D0D3',
                 '#D6D572', '#9178E3', '#A1E5B4', '#87A4B4', '#E4C16C'];
@@ -3552,6 +3559,52 @@ function getThemeStyle(theme) {
                 shapeFill: '#374151'
             };
             break;
+        case 'bootstrap5':
+            style = {
+                backgroundColor: 'rgba(255,255,255, 0.0)',
+                areaBackgroundColor: 'rgba(255,255,255, 0.0)',
+                titleFontColor: '#212529',
+                subTitleFontColor: '#212529',
+                legendTitleFontColor: '#212529',
+                legendTextColor: '#212529',
+                dataLabelFontColor: '#212529',
+                tooltipFontColor: '#F9FAFB',
+                tooltipFillColor: '#212529',
+                zoomFillColor: '#6C757D',
+                fontFamily: 'Helvetica Neue',
+                titleFontSize: '14px',
+                legendFontSize: '12px',
+                tooltipFillOpacity: 1,
+                tooltipTextOpacity: 1,
+                labelFontFamily: 'Helvetica Neue',
+                titleFontWeight: 'normal',
+                zoomSelectionColor: '#343A40',
+                shapeFill: '#E9ECEF'
+            };
+            break;
+        case 'bootstrap5dark':
+            style = {
+                backgroundColor: 'rgba(255,255,255, 0.0)',
+                areaBackgroundColor: 'rgba(255,255,255, 0.0)',
+                titleFontColor: '#FFFFFF',
+                subTitleFontColor: '#FFFFFF',
+                legendTitleFontColor: '#FFFFFF',
+                legendTextColor: '#FFFFFF',
+                dataLabelFontColor: '#FFFFFF',
+                tooltipFontColor: '#212529',
+                tooltipFillColor: '#E9ECEF',
+                zoomFillColor: '#B5BABE',
+                fontFamily: 'Helvetica Neue',
+                titleFontSize: '14px',
+                legendFontSize: '12px',
+                tooltipFillOpacity: 1,
+                tooltipTextOpacity: 1,
+                labelFontFamily: 'Helvetica Neue',
+                titleFontWeight: 'normal',
+                zoomSelectionColor: '#DEE2E6',
+                shapeFill: '#495057'
+            };
+            break;
         default:
             style = {
                 backgroundColor: '#FFFFFF',
@@ -4445,15 +4498,6 @@ __decorate$1([
     Complex({ color: 'transparent', width: 1 }, Border)
 ], MapsAreaSettings.prototype, "border", void 0);
 
-var __rest = (undefined && undefined.__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;
-};
 /**
  * Marker class
  */
@@ -4733,10 +4777,6 @@ class Marker {
             longitude: options.data['longitude'] || options.data['Longitude'],
             value: options.data['name']
         };
-        if (this.maps.isBlazor) {
-            const { maps, marker: marker$$1 } = eventArgs, blazorEventArgs = __rest(eventArgs, ["maps", "marker"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger(markerClick, eventArgs);
     }
     /**
@@ -4815,9 +4855,6 @@ class Marker {
                     collection = [];
                     for (const i of indexes) {
                         collection.push({ data: marker$$1.dataSource[i], index: i });
-                        if (this.maps.isBlazor) {
-                            marker$$1.dataSource[i]['text'] = '';
-                        }
                         markCollection.push(marker$$1.dataSource[i]);
                     }
                     isClusterSame = false;
@@ -5332,15 +5369,6 @@ class ColorMapping {
     }
 }
 
-var __rest$1 = (undefined && undefined.__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;
-};
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
 /* eslint-disable jsdoc/require-param */
 /* eslint-disable no-case-declarations */
@@ -5555,10 +5583,6 @@ class LayerPanel {
             cancel: false, name: layerRendering, index: layerIndex,
             layer: layer, maps: this.mapObject, visible: layer.visible
         };
-        if (this.mapObject.isBlazor) {
-            const { maps, layer } = eventArgs, blazorEventArgs = __rest$1(eventArgs, ["maps", "layer"]);
-            eventArgs = blazorEventArgs;
-        }
         this.mapObject.trigger('layerRendering', eventArgs, (observedArgs) => {
             if (!eventArgs.cancel && eventArgs.visible) {
                 if (layer.layerType !== 'Geometry') {
@@ -5593,11 +5617,6 @@ class LayerPanel {
                                 bing.maxZoom = maxZoom;
                             }
                             proxy.mapObject['bingMap'] = bing;
-                            if (this.mapObject.isBlazor) {
-                                if (!isNullOrUndefined(markerGroupElement)) {
-                                    removeElement(this.mapObject.element.id + '_Markers_Group');
-                                }
-                            }
                             proxy.renderTileLayer(proxy, layer, layerIndex, bing);
                             this.mapObject.arrangeTemplate();
                         };
@@ -5761,10 +5780,6 @@ class LayerPanel {
                     shape: shapeSettings, fill: fill,
                     border: { width: borderValue.width, color: borderValue.color, opacity: borderValue.opacity }
                 };
-                if (this.mapObject.isBlazor) {
-                    const { maps } = eventArgs, blazorEventArgs = __rest$1(eventArgs, ["maps"]);
-                    eventArgs = blazorEventArgs;
-                }
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 const shapeRenderingSuccess = (eventArgs) => {
                     let drawingType = !isNullOrUndefined(currentShapeData['_isMultiPolygon'])
@@ -6607,9 +6622,6 @@ class Annotations {
         });
         if (annotationGroup.childElementCount > 0 && !(isNullOrUndefined(getElementByID(secondaryID)))) {
             getElementByID(secondaryID).appendChild(annotationGroup);
-            for (let i = 0; i < this.map.annotations.length; i++) {
-                updateBlazorTemplate(this.map.element.id + '_ContentTemplate_' + i, 'ContentTemplate', this.map.annotations[i]);
-            }
         }
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         this.map.renderReactTemplates();
@@ -6638,10 +6650,9 @@ class Annotations {
             if (argsData.cancel) {
                 return;
             }
-            const blazor = 'Blazor';
             templateFn = getTemplateFunction(argsData.content);
-            if (templateFn && (!window[blazor] ? templateFn(this.map, this.map, argsData.content, this.map.element.id + '_ContentTemplate_' + annotationIndex).length : {})) {
-                templateElement = Array.prototype.slice.call(templateFn(!window[blazor] ? this.map : {}, this.map, argsData.content, this.map.element.id + '_ContentTemplate_' + annotationIndex));
+            if (templateFn && templateFn(this.map, this.map, argsData.content, this.map.element.id + '_ContentTemplate_' + annotationIndex).length) {
+                templateElement = Array.prototype.slice.call(templateFn(this.map, this.map, argsData.content, this.map.element.id + '_ContentTemplate_' + annotationIndex));
                 const length = templateElement.length;
                 for (let i = 0; i < length; i++) {
                     childElement.appendChild(templateElement[i]);
@@ -6884,20 +6895,14 @@ let Maps = class Maps extends Component {
      */
     preRender() {
         this.isDevice = Browser.isDevice;
-        this.isBlazor = isBlazor();
         this.initPrivateVariable();
         this.allowServerDataBinding = false;
         this.unWireEVents();
         this.wireEVents();
         this.setCulture();
     }
-    /**
-     * To Initialize the control rendering.
-     *
-     * @returns {void}
-     */
-    render() {
-        this.trigger(load, this.isBlazor ? {} : { maps: this });
+    renderElements() {
+        this.trigger(load, { maps: this });
         this.createSVG();
         this.findBaseAndSubLayers();
         this.createSecondaryElement();
@@ -6909,6 +6914,14 @@ let Maps = class Maps extends Component {
         this.processRequestJsonData();
         this.renderComplete();
     }
+    /**
+     * To Initialize the control rendering.
+     *
+     * @returns {void}
+     */
+    render() {
+        this.renderElements();
+    }
     processRequestJsonData() {
         const length = this.layersCollection.length - 1;
         this.serverProcess = { request: 0, response: 0 };
@@ -6918,7 +6931,7 @@ let Maps = class Maps extends Component {
             if (layer.shapeData instanceof DataManager) {
                 this.serverProcess['request']++;
                 dataModule = layer.shapeData;
-                queryModule = layer.query instanceof Query ? layer.query : this.isBlazor ? (new Query().requiresCount()) : new Query();
+                queryModule = layer.query instanceof Query ? layer.query : new Query();
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 const dataManager = dataModule.executeQuery(queryModule);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -6934,7 +6947,7 @@ let Maps = class Maps extends Component {
             if (layer.dataSource instanceof DataManager) {
                 this.serverProcess['request']++;
                 dataModule = layer.dataSource;
-                queryModule = layer.query instanceof Query ? layer.query : this.isBlazor ? (new Query().requiresCount()) : new Query();
+                queryModule = layer.query instanceof Query ? layer.query : new Query();
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 const dataManager = dataModule.executeQuery(queryModule);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -6948,8 +6961,7 @@ let Maps = class Maps extends Component {
                     if (layer.markerSettings[i].dataSource instanceof DataManager) {
                         this.serverProcess['request']++;
                         dataModule = layer.markerSettings[i].dataSource;
-                        queryModule = layer.markerSettings[i].query instanceof Query ? layer.markerSettings[i].query : this.isBlazor ?
-                            (new Query().requiresCount()) : new Query();
+                        queryModule = layer.markerSettings[i].query instanceof Query ? layer.markerSettings[i].query : new Query();
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         const dataManager = dataModule.executeQuery(queryModule);
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -6965,8 +6977,7 @@ let Maps = class Maps extends Component {
                     if (layer.bubbleSettings[i].dataSource instanceof DataManager) {
                         this.serverProcess['request']++;
                         dataModule = layer.bubbleSettings[i].dataSource;
-                        queryModule = layer.bubbleSettings[i].query instanceof Query ? layer.bubbleSettings[i].query : this.isBlazor ?
-                            (new Query().requiresCount()) : new Query();
+                        queryModule = layer.bubbleSettings[i].query instanceof Query ? layer.bubbleSettings[i].query : new Query();
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         const dataManager = dataModule.executeQuery(queryModule);
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -7124,7 +7135,6 @@ let Maps = class Maps extends Component {
             tileElement1.style.left = left + 'px';
         }
         this.arrangeTemplate();
-        const blazor = this.isBlazor ? this.blazorTemplates() : null;
         if (this.annotationsModule) {
             if (this.width !== '0px' && this.height !== '0px' && this.width !== '0%' && this.height !== '0%') {
                 this.annotationsModule.renderAnnotationElements();
@@ -7137,7 +7147,7 @@ let Maps = class Maps extends Component {
             }
         }
         this.zoomingChange();
-        this.trigger(loaded, this.isBlazor ? { isResized: this.isResize } : { maps: this, isResized: this.isResize });
+        this.trigger(loaded, { maps: this, isResized: this.isResize });
         this.isResize = false;
     }
     /**
@@ -7203,36 +7213,6 @@ let Maps = class Maps extends Component {
             }
         }
     }
-    /**
-     * To append blazor templates
-     *
-     * @returns {void}
-     * @private
-     */
-    blazorTemplates() {
-        for (let i = 0; i < this.layers.length; i++) {
-            const markerLength = this.layers[i].markerSettings.length - 1;
-            if (markerLength >= 0) {
-                if (this.layers[i].dataLabelSettings.visible || this.layers[i].markerSettings[markerLength].template) {
-                    updateBlazorTemplate(this.element.id + '_LabelTemplate', 'LabelTemplate', this.layers[i].dataLabelSettings);
-                    for (let j = 0; j < this.layers[i].markerSettings.length; j++) {
-                        const markerRendered = () => {
-                            for (let x = 0; x < this.layers.length; x++) {
-                                const markerTemplateEle = document.getElementById(this.element.id + '_LayerIndex_' + x + '_Markers_Template_Group');
-                                if (!isNullOrUndefined(markerTemplateEle)) {
-                                    for (let z = 0; z < markerTemplateEle.childElementCount; z++) {
-                                        const markerTemplate$$1 = markerTemplateEle.childNodes[z];
-                                        markerTemplate$$1['style']['transform'] = 'translate(-50%, -50%)';
-                                    }
-                                }
-                            }
-                        };
-                        updateBlazorTemplate(this.element.id + '_MarkerTemplate' + j, 'MarkerTemplate', this.layers[i].markerSettings[j], undefined, markerRendered);
-                    }
-                }
-            }
-        }
-    }
     /**
      * Render the map area border
      *
@@ -7508,12 +7488,6 @@ let Maps = class Maps extends Component {
      * @returns {void}
      */
     createSVG() {
-        resetBlazorTemplate(this.element.id + '_LabelTemplate', 'LabelTemplate');
-        for (let i = 0; i < this.layers.length; i++) {
-            for (let j = 0; j < this.layers[i].markerSettings.length; j++) {
-                resetBlazorTemplate(this.element.id + '_MarkerTemplate' + j, 'MarkerTemplate');
-            }
-        }
         this.removeSvg();
         createSvg(this);
     }
@@ -7523,9 +7497,6 @@ let Maps = class Maps extends Component {
      * @returns {void}
      */
     removeSvg() {
-        for (let i = 0; i < this.annotations.length; i++) {
-            resetBlazorTemplate(this.element.id + '_ContentTemplate_' + i, 'ContentTemplate');
-        }
         removeElement(this.element.id + '_Secondary_Element');
         removeElement(this.element.id + '_tile_parent');
         removeElement(this.element.id + '_tiles');
@@ -7603,7 +7574,6 @@ let Maps = class Maps extends Component {
      * This method is used to perform the operations when a click operation is performed on maps.
      *
      * @param {PointerEvent} e - Specifies the pointer event on maps.
-     * @blazorProperty 'PerformClick'
      */
     mapsOnClick(e) {
         const targetEle = e.target;
@@ -7754,7 +7724,9 @@ let Maps = class Maps extends Component {
             }
         }
         this.notify(Browser.touchEndEvent, e);
-        e.preventDefault();
+        if (e.cancelable) {
+            e.preventDefault();
+        }
         return false;
     }
     /**
@@ -7802,7 +7774,6 @@ let Maps = class Maps extends Component {
      * This method is used to perform operations when performing the double click operation on maps.
      *
      * @param {PointerEvent} e - Specifies the pointer event.
-     * @blazorProperty 'PerformDoubleClick'
      */
     mapsOnDoubleClick(e) {
         this.notify('dblclick', e);
@@ -7828,9 +7799,7 @@ let Maps = class Maps extends Component {
             }
             const doubleClickArgs = { cancel: false, name: doubleClick, x: e.clientX, y: e.clientY,
                 target: targetId, latitude: latitude, longitude: longitude, isShapeSelected: null };
-            const doubleClickBlazorArgs = { cancel: false, name: doubleClick, x: e.clientX, y: e.clientY,
-                target: targetId, latitude: latitude, longitude: longitude, isShapeSelected: null };
-            this.trigger('doubleClick', this.isBlazor ? doubleClickBlazorArgs : doubleClickArgs);
+            this.trigger('doubleClick', doubleClickArgs);
         }
     }
     /**
@@ -7925,7 +7894,7 @@ let Maps = class Maps extends Component {
             name: resize,
             previousSize: this.availableSize,
             currentSize: new Size(0, 0),
-            maps: !this.isBlazor ? this : null
+            maps: this
         };
         if (this.resizeTo) {
             clearTimeout(this.resizeTo);
@@ -8197,7 +8166,7 @@ let Maps = class Maps extends Component {
         this.zoomNotApplied = true;
         this.scaleOfGivenLocation = calculateZoomLevel(minLatitude, maxLatitude, minLongitude, maxLongitude, this.mapAreaRect.width, this.mapAreaRect.height, this);
         const zoomArgs = {
-            cancel: false, name: 'zoom', type: zoomIn, maps: !this.isBlazor ? this : null,
+            cancel: false, name: 'zoom', type: zoomIn, maps: this,
             tileTranslatePoint: {}, translatePoint: {},
             tileZoomLevel: this.isTileMap ? { previous: this.tileZoomLevel, current: this.scaleOfGivenLocation } : {},
             scale: !this.isTileMap ? { previous: this.scale, current: this.scaleOfGivenLocation } :
@@ -8345,19 +8314,21 @@ let Maps = class Maps extends Component {
                     render = true;
                     break;
                 case 'zoomSettings':
-                    if (newProp.zoomSettings.zoomFactor !== oldProp.zoomSettings.zoomFactor) {
-                        render = false;
-                    }
-                    else if (newProp.zoomSettings.shouldZoomInitially !== oldProp.zoomSettings.shouldZoomInitially) {
-                        this.zoomSettings.zoomFactor = 1;
-                        render = true;
-                    }
-                    else if (newProp.zoomSettings.enable !== oldProp.zoomSettings.enable) {
-                        this.zoomSettings.zoomFactor = 1;
-                        render = true;
-                    }
-                    else {
-                        render = true;
+                    if (!isNullOrUndefined(oldProp.zoomSettings)) {
+                        if (newProp.zoomSettings.zoomFactor !== oldProp.zoomSettings.zoomFactor) {
+                            render = false;
+                        }
+                        else if (newProp.zoomSettings.shouldZoomInitially !== oldProp.zoomSettings.shouldZoomInitially) {
+                            this.zoomSettings.zoomFactor = 1;
+                            render = true;
+                        }
+                        else if (newProp.zoomSettings.enable !== oldProp.zoomSettings.enable) {
+                            this.zoomSettings.zoomFactor = 1;
+                            render = true;
+                        }
+                        else {
+                            render = true;
+                        }
                     }
                     break;
                 case 'locale':
@@ -8370,12 +8341,7 @@ let Maps = class Maps extends Component {
             if (newProp.layers && isMarker) {
                 removeElement(this.element.id + '_Markers_Group');
                 if (this.isTileMap) {
-                    if (this.isBlazor) {
-                        this.render();
-                    }
-                    else {
-                        this.mapLayerPanel.renderTileLayer(this.mapLayerPanel, this.layers['currentFactor'], (this.layers.length - 1));
-                    }
+                    this.mapLayerPanel.renderTileLayer(this.mapLayerPanel, this.layers['currentFactor'], (this.layers.length - 1));
                 }
                 else {
                     this.render();
@@ -8386,7 +8352,7 @@ let Maps = class Maps extends Component {
             }
             else {
                 this.createSVG();
-                this.render();
+                this.renderElements();
             }
         }
     }
@@ -8874,15 +8840,6 @@ Maps = __decorate([
     NotifyPropertyChanges
 ], Maps);
 
-var __rest$2 = (undefined && undefined.__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;
-};
 /**
  * Bubble module class
  */
@@ -8979,14 +8936,14 @@ class Bubble {
             width: bubbleSettings.border.width
         };
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        const center = findMidPointOfPolygon(shapePoints[midIndex], projectionType);
+        const center = findMidPointOfPolygon(shapePoints[midIndex], projectionType, layer.geometryType);
         if (bubbleSettings.visible) {
             if (!isNullOrUndefined(center)) {
                 centerY = this.maps.projectionType === 'Mercator' ? center['y'] : (-center['y']);
                 eventArgs = {
                     cancel: false, name: bubbleRendering, border: bubbleBorder,
                     cx: center['x'], cy: centerY, data: shapeData, fill: bubbleColor,
-                    maps: this.maps.isBlazor ? null : this.maps, radius: radius
+                    maps: this.maps, radius: radius
                 };
             }
             else {
@@ -8995,17 +8952,13 @@ class Bubble {
                     eventArgs = {
                         cancel: false, name: bubbleRendering, border: bubbleBorder,
                         cx: shapePoints[shapePointsLength]['x'], cy: shapePoints[shapePointsLength]['y'],
-                        data: shapeData, fill: bubbleColor, maps: this.maps.isBlazor ? null : this.maps,
+                        data: shapeData, fill: bubbleColor, maps: this.maps,
                         radius: radius
                     };
                 }
                 else {
                     return;
                 }
-                if (this.maps.isBlazor) {
-                    const { maps } = eventArgs, blazorEventArgs = __rest$2(eventArgs, ["maps"]);
-                    eventArgs = blazorEventArgs;
-                }
             }
             this.maps.trigger('bubbleRendering', eventArgs, (bubbleArgs) => {
                 if (eventArgs.cancel) {
@@ -9092,10 +9045,6 @@ class Bubble {
             cancel: false, name: bubbleClick, data: data, maps: this.maps,
             target: target, x: e.clientX, y: e.clientY
         };
-        if (this.maps.isBlazor) {
-            const { maps } = eventArgs, blazorEventArgs = __rest$2(eventArgs, ["maps"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger(bubbleClick, eventArgs);
     }
     /**
@@ -9139,10 +9088,6 @@ class Bubble {
             cancel: false, name: bubbleMouseMove, data: data, maps: this.maps,
             target: target, x: e.clientX, y: e.clientY
         };
-        if (this.maps.isBlazor) {
-            const { maps } = eventArgs, blazorEventArgs = __rest$2(eventArgs, ["maps"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger(bubbleMouseMove, eventArgs);
     }
     /**
@@ -9167,15 +9112,6 @@ class Bubble {
     }
 }
 
-var __rest$3 = (undefined && undefined.__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;
-};
 /**
  * DataLabel Module used to render the maps datalabel
  */
@@ -9347,7 +9283,7 @@ class DataLabel {
             };
         }
         else {
-            location = findMidPointOfPolygon(shapePoint[midIndex], projectionType);
+            location = findMidPointOfPolygon(shapePoint[midIndex], projectionType, layer.geometryType);
         }
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const firstLevelMapLocation = location;
@@ -9368,7 +9304,7 @@ class DataLabel {
                 location['x'] = ((location['x'] + zoomTransPoint['x']) * scale);
                 location['y'] = ((location['y'] + zoomTransPoint['y']) * scale);
             }
-            location['y'] = (this.maps.projectionType === 'Mercator') ? location['y'] : (-location['y']);
+            location['y'] = (this.maps.projectionType === 'Mercator') || layer.geometryType === 'Normal' ? location['y'] : (-location['y']);
             if (!isNullOrUndefined(this.maps.format) && !isNaN(parseFloat(text))) {
                 if (this.maps.useGroupingSeparator) {
                     text = Internalize(this.maps, parseFloat(text));
@@ -9382,10 +9318,6 @@ class DataLabel {
                     width: dataLabel.border.width, opacity: dataLabel.border.opacity }, datalabel: dataLabel,
                 fill: dataLabel.fill, template: dataLabel.template, text: text
             };
-            if (this.maps.isBlazor) {
-                const { maps, datalabel } = eventargs, blazorEventArgs = __rest$3(eventargs, ["maps", "datalabel"]);
-                eventargs = blazorEventArgs;
-            }
             this.maps.trigger('dataLabelRendering', eventargs, (labelArgs) => {
                 if (eventargs.cancel) {
                     return;
@@ -9413,7 +9345,7 @@ class DataLabel {
                 if (!isPoint && position.length > 5 && (shapeData['geometry']['type'] !== 'MultiPolygon') &&
                     (shapeData['type'] !== 'MultiPolygon')) {
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    const location1 = findMidPointOfPolygon(position, projectionType);
+                    const location1 = findMidPointOfPolygon(position, projectionType, layer.geometryType);
                     if (zoomLabelsPosition && scaleZoomValue > 1 && !this.maps.zoomNotApplied && eventargs.template === '') {
                         location1['x'] = ((this.maps.zoomLabelPositions[index]['location']['x'] + zoomTransPoint['x']) * scale);
                         location1['y'] = ((this.maps.zoomLabelPositions[index]['location']['y'] + zoomTransPoint['y']) * scale);
@@ -9440,7 +9372,8 @@ class DataLabel {
                 }
                 else {
                     if (dataLabelSettings.smartLabelMode === 'Trim') {
-                        trimmedLable = textTrim(width, text, style);
+                        let textType = typeof text === 'number' ? text.toString() : text;
+                        trimmedLable = textTrim(width, textType, style);
                         elementSize = measureText(trimmedLable, style);
                         options = new TextOption(labelId, textLocation.x, textLocation.y, 'middle', trimmedLable, '', '');
                     }
@@ -10262,7 +10195,7 @@ class Legend {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const collection = this.maps.legendModule.legendCollection;
         let length;
-        const multiSelectEnable = this.maps.layers[collection[0]['data'][0]['layerIndex']].selectionSettings.enableMultiSelect;
+        const multiSelectEnable = !isNullOrUndefined(collection[0]['data'][0]['layerIndex']) ? this.maps.layers[collection[0]['data'][0]['layerIndex']].selectionSettings.enableMultiSelect : false;
         let selectLength = 0;
         let interactProcess = true;
         const idIndex = parseFloat(targetElement.id.charAt(targetElement.id.length - 1));
@@ -11722,15 +11655,6 @@ class Legend {
     }
 }
 
-var __rest$4 = (undefined && undefined.__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;
-};
 /**
  * Highlight module class
  */
@@ -11894,10 +11818,6 @@ class Highlight {
             data: data,
             maps: this.maps
         };
-        if (this.maps.isBlazor) {
-            const { shapeData, maps } = eventArgs, blazorEventArgs = __rest$4(eventArgs, ["shapeData", "maps"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger(itemHighlight, eventArgs, () => {
             eventArgs.border.opacity = isNullOrUndefined(this.highlightSettings.border.opacity) ? this.highlightSettings.opacity : this.highlightSettings.border.opacity;
             this.highlightMap(targetEle, eventArgs);
@@ -11950,15 +11870,6 @@ class Highlight {
     }
 }
 
-var __rest$5 = (undefined && undefined.__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;
-};
 /**
  * Selection module class
  */
@@ -12096,10 +12007,6 @@ class Selection {
             data: data,
             maps: this.maps
         };
-        if (this.maps.isBlazor) {
-            const { shapeData, maps } = eventArgs, blazorEventArgs = __rest$5(eventArgs, ["shapeData", "maps"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger('itemSelection', eventArgs, (observedArgs) => {
             eventArgs.border.opacity = isNullOrUndefined(this.selectionsettings.border.opacity) ? this.selectionsettings.opacity : this.selectionsettings.border.opacity;
             if (!eventArgs.cancel) {
@@ -12413,131 +12320,62 @@ class MapsTooltip {
                 maps: this.maps,
                 element: target, eventArgs: e
             };
-            if (this.maps.isBlazor) {
-                const tootipOption = {
-                    location: location
-                };
-                const blazorArgs = {
-                    name: tooltipRender,
-                    cancel: false,
-                    options: tootipOption,
-                    data: templateData,
-                    textStyle: tooltipArgs.options['textStyle'],
-                    fill: tooltipArgs.fill,
-                    element: target, eventArgs: e
-                };
-                this.maps.trigger(tooltipRender, blazorArgs, (args) => {
-                    if (!blazorArgs.cancel && option.visible && !isNullOrUndefined(currentData) &&
-                        (targetId.indexOf('_cluster_') === -1 && targetId.indexOf('_dataLabel_') === -1)) {
-                        if (targetId.indexOf('MarkerIndex') > 0) {
-                            
-                        }
-                        else if (targetId.indexOf('BubbleIndex') > 0) {
-                            
-                        }
-                        else {
-                            
-                        }
-                        this.maps['isProtectedOnChange'] = true;
-                        if (blazorArgs.cancel) {
-                            this.svgTooltip = new Tooltip({
-                                enable: true,
-                                header: '',
-                                content: [currentData.toString()],
-                                shapes: [],
-                                location: tootipOption.location,
-                                palette: [markerFill],
-                                areaBounds: this.maps.mapAreaRect,
-                                textStyle: tooltipArgs.options['textStyle'],
-                                availableSize: this.maps.availableSize,
-                                fill: tooltipArgs.fill
-                            });
-                        }
-                        else {
-                            this.svgTooltip = new Tooltip({
-                                enable: true,
-                                header: '',
-                                content: [currentData.toString()],
-                                shapes: [],
-                                location: tootipOption.location,
-                                palette: [markerFill],
-                                areaBounds: this.maps.mapAreaRect,
-                                textStyle: blazorArgs.textStyle,
-                                availableSize: this.maps.availableSize,
-                                fill: blazorArgs.fill
-                            });
-                        }
-                        const tooltipElement = tooltipEle;
-                        this.svgTooltip.opacity = this.maps.themeStyle.tooltipFillOpacity || this.svgTooltip.opacity;
-                        this.svgTooltip.appendTo(tooltipElement);
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        this.maps.renderReactTemplates();
+            this.maps.trigger(tooltipRender, tooltipArgs, (args) => {
+                if (!tooltipArgs.cancel && option.visible && !isNullOrUndefined(currentData) &&
+                    (targetId.indexOf('_cluster_') === -1 && targetId.indexOf('_dataLabel_') === -1)) {
+                    this.maps['isProtectedOnChange'] = true;
+                    tooltipArgs.options['textStyle']['color'] = tooltipArgs.options['textStyle']['color']
+                        || this.maps.themeStyle.tooltipFontColor;
+                    if (tooltipArgs.cancel) {
+                        this.svgTooltip = new Tooltip({
+                            enable: true,
+                            header: '',
+                            data: option['data'],
+                            template: option['template'],
+                            content: [currentData.toString()],
+                            shapes: [],
+                            location: option['location'],
+                            palette: [markerFill],
+                            areaBounds: this.maps.mapAreaRect,
+                            textStyle: option['textStyle'],
+                            availableSize: this.maps.availableSize,
+                            fill: option.fill || this.maps.themeStyle.tooltipFillColor
+                        });
                     }
                     else {
-                        this.removeTooltip();
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        this.maps.clearTemplate();
-                    }
-                });
-            }
-            else {
-                this.maps.trigger(tooltipRender, tooltipArgs, (args) => {
-                    if (!tooltipArgs.cancel && option.visible && !isNullOrUndefined(currentData) &&
-                        (targetId.indexOf('_cluster_') === -1 && targetId.indexOf('_dataLabel_') === -1)) {
-                        this.maps['isProtectedOnChange'] = true;
-                        tooltipArgs.options['textStyle']['color'] = tooltipArgs.options['textStyle']['color']
-                            || this.maps.themeStyle.tooltipFontColor;
-                        if (tooltipArgs.cancel) {
-                            this.svgTooltip = new Tooltip({
-                                enable: true,
-                                header: '',
-                                data: option['data'],
-                                template: option['template'],
-                                content: [currentData.toString()],
-                                shapes: [],
-                                location: option['location'],
-                                palette: [markerFill],
-                                areaBounds: this.maps.mapAreaRect,
-                                textStyle: option['textStyle'],
-                                availableSize: this.maps.availableSize,
-                                fill: option.fill || this.maps.themeStyle.tooltipFillColor
-                            });
-                        }
-                        else {
-                            this.svgTooltip = new Tooltip({
-                                enable: true,
-                                header: '',
-                                data: tooltipArgs.options['data'],
-                                template: tooltipArgs.options['template'],
-                                content: [currentData.toString()],
-                                shapes: [],
-                                location: tooltipArgs.options['location'],
-                                palette: [markerFill],
-                                areaBounds: this.maps.mapAreaRect,
-                                textStyle: tooltipArgs.options['textStyle'],
-                                availableSize: this.maps.availableSize,
-                                fill: tooltipArgs.fill || this.maps.themeStyle.tooltipFillColor
-                            });
-                        }
-                        this.svgTooltip.opacity = this.maps.themeStyle.tooltipFillOpacity || this.svgTooltip.opacity;
-                        this.svgTooltip.appendTo(tooltipEle);
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        this.maps.renderReactTemplates();
-                        tooltipTemplateElement = document.getElementById(this.maps.element.id + '_mapsTooltip');
-                        if (tooltipTemplateElement !== null && tooltipTemplateElement.innerHTML.indexOf('href') !== -1
-                            && tooltipTemplateElement.innerHTML.indexOf('</a>') !== -1) {
-                            let templateStyle = tooltipTemplateElement.getAttribute('style');
-                            templateStyle = templateStyle.replace('pointer-events: none;', 'position-events:all;');
-                            tooltipTemplateElement.setAttribute('style', templateStyle);
-                        }
+                        this.svgTooltip = new Tooltip({
+                            enable: true,
+                            header: '',
+                            data: tooltipArgs.options['data'],
+                            template: tooltipArgs.options['template'],
+                            content: [currentData.toString()],
+                            shapes: [],
+                            location: tooltipArgs.options['location'],
+                            palette: [markerFill],
+                            areaBounds: this.maps.mapAreaRect,
+                            textStyle: tooltipArgs.options['textStyle'],
+                            availableSize: this.maps.availableSize,
+                            fill: tooltipArgs.fill || this.maps.themeStyle.tooltipFillColor
+                        });
                     }
-                    else {
-                        this.removeTooltip();
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        this.maps.clearTemplate();
+                    this.svgTooltip.opacity = this.maps.themeStyle.tooltipFillOpacity || this.svgTooltip.opacity;
+                    this.svgTooltip.appendTo(tooltipEle);
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    this.maps.renderReactTemplates();
+                    tooltipTemplateElement = document.getElementById(this.maps.element.id + '_mapsTooltip');
+                    if (tooltipTemplateElement !== null && tooltipTemplateElement.innerHTML.indexOf('href') !== -1
+                        && tooltipTemplateElement.innerHTML.indexOf('</a>') !== -1) {
+                        let templateStyle = tooltipTemplateElement.getAttribute('style');
+                        templateStyle = templateStyle.replace('pointer-events: none;', 'position-events:all;');
+                        tooltipTemplateElement.setAttribute('style', templateStyle);
                     }
-                });
-            }
+                }
+                else {
+                    this.removeTooltip();
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    this.maps.clearTemplate();
+                }
+            });
             if (this.svgTooltip) {
                 this.maps.trigger('tooltipRenderComplete', {
                     cancel: false, name: 'tooltipRenderComplete', maps: this.maps, options: tooltipOption,
@@ -12667,15 +12505,6 @@ class MapsTooltip {
     }
 }
 
-var __rest$6 = (undefined && undefined.__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;
-};
 /**
  * Zoom module used to process the zoom for maps
  */
@@ -12799,14 +12628,14 @@ class Zoom {
         let zoomArgs;
         if (!map.isTileMap) {
             zoomArgs = {
-                cancel: false, name: 'zoom', type: type, maps: !map.isBlazor ? map : null,
+                cancel: false, name: 'zoom', type: type, maps: map,
                 tileTranslatePoint: {}, translatePoint: { previous: map.previousPoint, current: map.translatePoint },
                 tileZoomLevel: {}, scale: { previous: map.previousScale, current: map.scale }
             };
         }
         else {
             zoomArgs = {
-                cancel: false, name: 'zoom', type: type, maps: !map.isBlazor ? map : null,
+                cancel: false, name: 'zoom', type: type, maps: map,
                 tileTranslatePoint: { previous: prevTilePoint, current: map.tileTranslatePoint }, translatePoint: { previous: map.previousPoint, current: map.translatePoint },
                 tileZoomLevel: { previous: prevLevel, current: map.tileZoomLevel }, scale: { previous: map.previousScale, current: map.scale }
             };
@@ -13011,7 +12840,7 @@ class Zoom {
                             }
                         }
                         else if (currentEle.id.indexOf('_Markers_Group') > -1) {
-                            if (!this.isPanning || this.maps.isBlazor) {
+                            if (!this.isPanning) {
                                 this.markerTranslates(currentEle.childNodes[0], factor, x, y, scale, 'Marker', layerElement, animate$$1);
                             }
                             currentEle = layerElement.childNodes[j];
@@ -13130,7 +12959,6 @@ class Zoom {
                     }
                 }
                 this.maps.arrangeTemplate();
-                const blazor = this.maps.isBlazor ? this.maps.blazorTemplates() : null;
             }
             if (!isNullOrUndefined(this.currentLayer)) {
                 if (!animate$$1 || this.currentLayer.animationDuration === 0) {
@@ -13183,18 +13011,6 @@ class Zoom {
                 };
                 eventArgs = markerShapeChoose(eventArgs, data);
                 eventArgs = markerColorChoose(eventArgs, data);
-                if (this.maps.isBlazor) {
-                    const { maps, marker: marker$$1 } = eventArgs, blazorEventArgs = __rest$6(eventArgs, ["maps", "marker"]);
-                    eventArgs = blazorEventArgs;
-                    const latitudeValue = 'Latitude';
-                    const longitudeValue = 'Longitude';
-                    markerSettings.longitudeValuePath = !isNullOrUndefined(markerSettings.longitudeValuePath) ?
-                        markerSettings.longitudeValuePath : !isNullOrUndefined(data['Longitude']) ? longitudeValue :
-                        !isNullOrUndefined(data['longitude']) ? 'longitude' : null;
-                    markerSettings.latitudeValuePath = !isNullOrUndefined(markerSettings.latitudeValuePath) ?
-                        markerSettings.latitudeValuePath : !isNullOrUndefined(data['Latitude']) ? latitudeValue :
-                        !isNullOrUndefined(data['latitude']) ? 'latitude' : null;
-                }
                 this.maps.trigger('markerRendering', eventArgs, (MarkerArgs) => {
                     if (markerSettings.shapeValuePath !== eventArgs.shapeValuePath) {
                         eventArgs = markerShapeChoose(eventArgs, data);
@@ -13208,22 +13024,6 @@ class Zoom {
                     const long = (!isNullOrUndefined(markerSettings.longitudeValuePath)) ?
                         Number(getValueFromObject(data, markerSettings.longitudeValuePath)) : !isNullOrUndefined(data['longitude']) ?
                         parseFloat(data['longitude']) : !isNullOrUndefined(data['Longitude']) ? data['Longitude'] : 0;
-                    if (this.maps.isBlazor) {
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        const data1 = {};
-                        let j = 0;
-                        const text = [];
-                        for (let i = 0; i < Object.keys(data).length; i++) {
-                            if (Object.keys(data)[i].toLowerCase() !== 'text' && Object.keys(data)[i].toLowerCase() !== 'latitude'
-                                && Object.keys(data)[i].toLowerCase() !== 'blazortemplateid' && Object.keys(data)[i].toLowerCase() !== 'longitude'
-                                && Object.keys(data)[i].toLowerCase() !== 'name') {
-                                data1['text'] = text;
-                                text[j] = data[Object.keys(data)[i].toLowerCase()];
-                                j++;
-                            }
-                        }
-                        data['text'] = data1['text'];
-                    }
                     const offset = markerSettings.offset;
                     if (!eventArgs.cancel && markerSettings.visible && !isNullOrUndefined(long) && !isNullOrUndefined(lati)) {
                         const markerID = this.maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'
@@ -13442,28 +13242,6 @@ class Zoom {
         const layer = this.maps.layersCollection[layerIndex];
         const marker$$1 = layer.markerSettings[markerIndex];
         if (!isNullOrUndefined(marker$$1) && !isNullOrUndefined(marker$$1.dataSource) && !isNullOrUndefined(marker$$1.dataSource[dataIndex])) {
-            if (this.maps.isBlazor) {
-                marker$$1.longitudeValuePath = !isNullOrUndefined(marker$$1.longitudeValuePath) ?
-                    marker$$1.longitudeValuePath : !isNullOrUndefined(marker$$1.dataSource[dataIndex]['Longitude']) ? 'Longitude' :
-                    !isNullOrUndefined(marker$$1.dataSource[dataIndex]['longitude']) ? 'longitude' : null;
-                marker$$1.latitudeValuePath = !isNullOrUndefined(marker$$1.latitudeValuePath) ?
-                    marker$$1.latitudeValuePath : !isNullOrUndefined(marker$$1.dataSource[dataIndex]['Latitude']) ? 'Latitude' :
-                    !isNullOrUndefined(marker$$1.dataSource[dataIndex]['latitude']) ? 'latitude' : null;
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                const data1 = {};
-                let j = 0;
-                const text = [];
-                for (let i = 0; i < Object.keys(marker$$1.dataSource[dataIndex]).length; i++) {
-                    if (Object.keys(marker$$1.dataSource[dataIndex])[i].toLowerCase() !== 'text' && Object.keys(marker$$1.dataSource[dataIndex])[i].toLowerCase() !== 'longitude'
-                        && Object.keys(marker$$1.dataSource[dataIndex])[i].toLowerCase() !== 'latitude' && Object.keys(marker$$1.dataSource[dataIndex])[i].toLowerCase() !== 'blazortemplateid'
-                        && Object.keys(marker$$1.dataSource[dataIndex])[i].toLowerCase() !== 'name') {
-                        data1['text'] = text;
-                        text[j] = marker$$1.dataSource[dataIndex][Object.keys(marker$$1.dataSource[dataIndex])[i].toLowerCase()];
-                        j++;
-                    }
-                }
-                marker$$1.dataSource[dataIndex]['text'] = data1['text'];
-            }
             const lng = (!isNullOrUndefined(marker$$1.longitudeValuePath)) ?
                 Number(getValueFromObject(marker$$1.dataSource[dataIndex], marker$$1.longitudeValuePath)) :
                 !isNullOrUndefined(marker$$1.dataSource[dataIndex]['longitude']) ? parseFloat(marker$$1.dataSource[dataIndex]['longitude']) :
@@ -13501,9 +13279,20 @@ class Zoom {
             }
             else {
                 if (type === 'Template') {
-                    const elementOffset = element.getBoundingClientRect();
-                    element.style.left = ((location.x + x) * scale) + marker$$1.offset.x - this.maps.mapAreaRect.x - (elementOffset.width / 2) + 'px';
-                    element.style.top = ((location.y + y) * scale) + marker$$1.offset.y - this.maps.mapAreaRect.y - (elementOffset.height / 2) + 'px';
+                    if (duration > 0) {
+                        location.x = ((Math.abs(this.maps.baseMapRectBounds['min']['x'] - location.x)) * scale);
+                        location.y = ((Math.abs(this.maps.baseMapRectBounds['min']['y'] - location.y)) * scale);
+                        const layerOffset = getElementByID(this.maps.element.id + '_Layer_Collections').getBoundingClientRect();
+                        const elementOffset = element.parentElement.getBoundingClientRect();
+                        element.style.left = (((location.x) + (layerOffset.left - elementOffset.left)) + marker$$1.offset.x) + 'px';
+                        element.style.top = (((location.y) + (layerOffset.top - elementOffset.top)) + marker$$1.offset.y) + 'px';
+                        element.style.transform = 'translate(-50%, -50%)';
+                    }
+                    else {
+                        const elementOffset = element.getBoundingClientRect();
+                        element.style.left = ((location.x + x) * scale) + marker$$1.offset.x - this.maps.mapAreaRect.x - (elementOffset.width / 2) + 'px';
+                        element.style.top = ((location.y + y) * scale) + marker$$1.offset.y - this.maps.mapAreaRect.y - (elementOffset.height / 2) + 'px';
+                    }
                 }
                 else {
                     location.x = (((location.x + x) * scale) + marker$$1.offset.x);
@@ -13547,7 +13336,7 @@ class Zoom {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             const location = this.maps.getGeoLocation(this.maps.layersCollection.length - 1, mouseLocation['layerX'], mouseLocation['layerY']);
             panArgs = {
-                cancel: false, name: pan, maps: !map.isBlazor ? map : null,
+                cancel: false, name: pan, maps: map,
                 tileTranslatePoint: {}, translatePoint: { previous: translatePoint, current: new Point(x, y) },
                 scale: map.scale, tileZoomLevel: map.tileZoomLevel, latitude: location['latitude'], longitude: location['longitude']
             };
@@ -13584,7 +13373,7 @@ class Zoom {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             const location = this.maps.getTileGeoLocation(mouseLocation['layerX'], mouseLocation['layerY']);
             panArgs = {
-                cancel: false, name: pan, maps: !map.isBlazor ? map : null,
+                cancel: false, name: pan, maps: map,
                 tileTranslatePoint: { previous: prevTilePoint, current: map.tileTranslatePoint },
                 translatePoint: { previous: translatePoint, current: map.translatePoint }, scale: map.scale,
                 tileZoomLevel: map.tileZoomLevel, latitude: location['latitude'], longitude: location['longitude']
@@ -14546,7 +14335,7 @@ class PdfExport {
             const exportElement = this.control.svgObject.cloneNode(true);
             const backgroundElement = exportElement.childNodes[0];
             const backgroundColor = backgroundElement.getAttribute('fill');
-            if ((this.control.theme === 'Tailwind' || this.control.theme === 'TailwindDark')
+            if ((this.control.theme === 'Tailwind' || this.control.theme === 'TailwindDark' || this.control.theme === 'Bootstrap5' || this.control.theme === 'Bootstrap5Dark')
                 && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
                 exportElement.childNodes[0].setAttribute('fill', 'rgba(255,255,255, 1)');
             }