@syncfusion/ej2-maps 19.2.60 → 19.3.53

package/src/maps/user-interaction/annotation.js

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 /* eslint-disable jsdoc/require-param */
 import { annotationRendering } from '../index';
-import { createElement, isNullOrUndefined, updateBlazorTemplate } from '@syncfusion/ej2-base';
+import { createElement, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { getTemplateFunction, getElementOffset, getElementByID } from '../utils/helper';
 /**
  * Represents the annotation elements for map.
@@ -24,9 +24,6 @@ var Annotations = /** @class */ (function () {
         });
         if (annotationGroup.childElementCount > 0 && !(isNullOrUndefined(getElementByID(secondaryID)))) {
             getElementByID(secondaryID).appendChild(annotationGroup);
-            for (var 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();
@@ -56,10 +53,9 @@ var Annotations = /** @class */ (function () {
             if (argsData.cancel) {
                 return;
             }
-            var 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));
                 var length_1 = templateElement.length;
                 for (var i = 0; i < length_1; i++) {
                     childElement.appendChild(templateElement[i]);

package/src/maps/user-interaction/highlight.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 { itemHighlight } from '../index';
 import { Browser, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { getElementsByClassName, getElement, removeClass, createStyle, customizeStyle, getTargetElement } from '../utils/helper';
@@ -174,10 +165,6 @@ var Highlight = /** @class */ (function () {
             data: data,
             maps: this.maps
         };
-        if (this.maps.isBlazor) {
-            var shapeData_1 = eventArgs.shapeData, maps = eventArgs.maps, blazorEventArgs = __rest(eventArgs, ["shapeData", "maps"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger(itemHighlight, eventArgs, function () {
             eventArgs.border.opacity = isNullOrUndefined(_this.highlightSettings.border.opacity) ? _this.highlightSettings.opacity : _this.highlightSettings.border.opacity;
             _this.highlightMap(targetEle, eventArgs);

package/src/maps/user-interaction/selection.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 { click, itemSelection } from '../index';
 import { getElement, createStyle, customizeStyle, removeClass, getTargetElement, getElementByID } from '../utils/helper';
 import { isNullOrUndefined, Browser } from '@syncfusion/ej2-base';
@@ -151,10 +142,6 @@ var Selection = /** @class */ (function () {
             data: data,
             maps: this.maps
         };
-        if (this.maps.isBlazor) {
-            var shapeData_1 = eventArgs.shapeData, maps = eventArgs.maps, blazorEventArgs = __rest(eventArgs, ["shapeData", "maps"]);
-            eventArgs = blazorEventArgs;
-        }
         this.maps.trigger('itemSelection', eventArgs, function (observedArgs) {
             eventArgs.border.opacity = isNullOrUndefined(_this.selectionsettings.border.opacity) ? _this.selectionsettings.opacity : _this.selectionsettings.border.opacity;
             if (!eventArgs.cancel) {

package/src/maps/user-interaction/tooltip.js

@@ -184,132 +184,62 @@ var MapsTooltip = /** @class */ (function () {
                 maps: this.maps,
                 element: target, eventArgs: e
             };
-            if (this.maps.isBlazor) {
-                var tootipOption_1 = {
-                    location: location
-                };
-                var blazorArgs_1 = {
-                    name: tooltipRender,
-                    cancel: false,
-                    options: tootipOption_1,
-                    data: templateData,
-                    textStyle: tooltipArgs.options['textStyle'],
-                    fill: tooltipArgs.fill,
-                    element: target, eventArgs: e
-                };
-                this.maps.trigger(tooltipRender, blazorArgs_1, function (args) {
-                    if (!blazorArgs_1.cancel && option.visible && !isNullOrUndefined(currentData) &&
-                        (targetId.indexOf('_cluster_') === -1 && targetId.indexOf('_dataLabel_') === -1)) {
-                        var blazTooltipName = void 0;
-                        if (targetId.indexOf('MarkerIndex') > 0) {
-                            blazTooltipName = 'MarkerTooltipTemplate';
-                        }
-                        else if (targetId.indexOf('BubbleIndex') > 0) {
-                            blazTooltipName = 'BubbleTooltipTemplate';
-                        }
-                        else {
-                            blazTooltipName = 'LayerTooltipTemplate';
-                        }
-                        _this.maps['isProtectedOnChange'] = true;
-                        if (blazorArgs_1.cancel) {
-                            _this.svgTooltip = new Tooltip({
-                                enable: true,
-                                header: '',
-                                content: [currentData.toString()],
-                                shapes: [],
-                                location: tootipOption_1.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_1.location,
-                                palette: [markerFill],
-                                areaBounds: _this.maps.mapAreaRect,
-                                textStyle: blazorArgs_1.textStyle,
-                                availableSize: _this.maps.availableSize,
-                                fill: blazorArgs_1.fill
-                            });
-                        }
-                        var 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, function (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, function (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) {
-                            var 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) {
+                        var 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,

package/src/maps/user-interaction/zoom.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 { Point, getElementByID, PathOption, Rect, convertGeoToPoint, CircleOption, convertTileLatLongToPoint } from '../utils/helper';
 import { RectOption, createTooltip, calculateScale, getTouchCenter, getTouches, targetTouches } from '../utils/helper';
 import { MapLocation, zoomAnimate, smoothTranslate, measureText, textTrim, clusterTemplate, marker } from '../utils/helper';
@@ -140,14 +131,14 @@ var Zoom = /** @class */ (function () {
         var 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 }
             };
@@ -358,7 +349,7 @@ var Zoom = /** @class */ (function () {
                             }
                         }
                         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);
                             }
                             currentEle = layerElement.childNodes[j];
@@ -477,7 +468,6 @@ var Zoom = /** @class */ (function () {
                     }
                 }
                 this.maps.arrangeTemplate();
-                var blazor = this.maps.isBlazor ? this.maps.blazorTemplates() : null;
             }
             if (!isNullOrUndefined(this.currentLayer)) {
                 if (!animate || this.currentLayer.animationDuration === 0) {
@@ -532,18 +522,6 @@ var Zoom = /** @class */ (function () {
                 };
                 eventArgs = markerShapeChoose(eventArgs, data);
                 eventArgs = markerColorChoose(eventArgs, data);
-                if (_this.maps.isBlazor) {
-                    var maps = eventArgs.maps, marker_1 = eventArgs.marker, blazorEventArgs = __rest(eventArgs, ["maps", "marker"]);
-                    eventArgs = blazorEventArgs;
-                    var latitudeValue = 'Latitude';
-                    var 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, function (MarkerArgs) {
                     if (markerSettings.shapeValuePath !== eventArgs.shapeValuePath) {
                         eventArgs = markerShapeChoose(eventArgs, data);
@@ -557,22 +535,6 @@ var Zoom = /** @class */ (function () {
                     var 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
-                        var data1 = {};
-                        var j = 0;
-                        var text = [];
-                        for (var 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'];
-                    }
                     var offset = markerSettings.offset;
                     if (!eventArgs.cancel && markerSettings.visible && !isNullOrUndefined(long) && !isNullOrUndefined(lati)) {
                         var markerID = _this.maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'
@@ -793,28 +755,6 @@ var Zoom = /** @class */ (function () {
         var layer = this.maps.layersCollection[layerIndex];
         var marker = layer.markerSettings[markerIndex];
         if (!isNullOrUndefined(marker) && !isNullOrUndefined(marker.dataSource) && !isNullOrUndefined(marker.dataSource[dataIndex])) {
-            if (this.maps.isBlazor) {
-                marker.longitudeValuePath = !isNullOrUndefined(marker.longitudeValuePath) ?
-                    marker.longitudeValuePath : !isNullOrUndefined(marker.dataSource[dataIndex]['Longitude']) ? 'Longitude' :
-                    !isNullOrUndefined(marker.dataSource[dataIndex]['longitude']) ? 'longitude' : null;
-                marker.latitudeValuePath = !isNullOrUndefined(marker.latitudeValuePath) ?
-                    marker.latitudeValuePath : !isNullOrUndefined(marker.dataSource[dataIndex]['Latitude']) ? 'Latitude' :
-                    !isNullOrUndefined(marker.dataSource[dataIndex]['latitude']) ? 'latitude' : null;
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                var data1 = {};
-                var j = 0;
-                var text = [];
-                for (var i = 0; i < Object.keys(marker.dataSource[dataIndex]).length; i++) {
-                    if (Object.keys(marker.dataSource[dataIndex])[i].toLowerCase() !== 'text' && Object.keys(marker.dataSource[dataIndex])[i].toLowerCase() !== 'longitude'
-                        && Object.keys(marker.dataSource[dataIndex])[i].toLowerCase() !== 'latitude' && Object.keys(marker.dataSource[dataIndex])[i].toLowerCase() !== 'blazortemplateid'
-                        && Object.keys(marker.dataSource[dataIndex])[i].toLowerCase() !== 'name') {
-                        data1['text'] = text;
-                        text[j] = marker.dataSource[dataIndex][Object.keys(marker.dataSource[dataIndex])[i].toLowerCase()];
-                        j++;
-                    }
-                }
-                marker.dataSource[dataIndex]['text'] = data1['text'];
-            }
             var lng = (!isNullOrUndefined(marker.longitudeValuePath)) ?
                 Number(getValueFromObject(marker.dataSource[dataIndex], marker.longitudeValuePath)) :
                 !isNullOrUndefined(marker.dataSource[dataIndex]['longitude']) ? parseFloat(marker.dataSource[dataIndex]['longitude']) :
@@ -852,9 +792,20 @@ var Zoom = /** @class */ (function () {
             }
             else {
                 if (type === 'Template') {
-                    var elementOffset = element.getBoundingClientRect();
-                    element.style.left = ((location_2.x + x) * scale) + marker.offset.x - this.maps.mapAreaRect.x - (elementOffset.width / 2) + 'px';
-                    element.style.top = ((location_2.y + y) * scale) + marker.offset.y - this.maps.mapAreaRect.y - (elementOffset.height / 2) + 'px';
+                    if (duration > 0) {
+                        location_2.x = ((Math.abs(this.maps.baseMapRectBounds['min']['x'] - location_2.x)) * scale);
+                        location_2.y = ((Math.abs(this.maps.baseMapRectBounds['min']['y'] - location_2.y)) * scale);
+                        var layerOffset = getElementByID(this.maps.element.id + '_Layer_Collections').getBoundingClientRect();
+                        var elementOffset = element.parentElement.getBoundingClientRect();
+                        element.style.left = (((location_2.x) + (layerOffset.left - elementOffset.left)) + marker.offset.x) + 'px';
+                        element.style.top = (((location_2.y) + (layerOffset.top - elementOffset.top)) + marker.offset.y) + 'px';
+                        element.style.transform = 'translate(-50%, -50%)';
+                    }
+                    else {
+                        var elementOffset = element.getBoundingClientRect();
+                        element.style.left = ((location_2.x + x) * scale) + marker.offset.x - this.maps.mapAreaRect.x - (elementOffset.width / 2) + 'px';
+                        element.style.top = ((location_2.y + y) * scale) + marker.offset.y - this.maps.mapAreaRect.y - (elementOffset.height / 2) + 'px';
+                    }
                 }
                 else {
                     location_2.x = (((location_2.x + x) * scale) + marker.offset.x);
@@ -898,7 +849,7 @@ var Zoom = /** @class */ (function () {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             var location_3 = 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_3['latitude'], longitude: location_3['longitude']
             };
@@ -935,7 +886,7 @@ var Zoom = /** @class */ (function () {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             var location_4 = 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_4['latitude'], longitude: location_4['longitude']

package/src/maps/utils/enum.d.ts

@@ -36,7 +36,11 @@ export declare type MapsTheme =
 /** Renders a map with Tailwind theme. */
 'Tailwind' | 
 /** Renders a map with TailwindDark theme. */
-'TailwindDark';
+'TailwindDark' | 
+/** Renders a map with Bootstrap5 theme. */
+'Bootstrap5' | 
+/**  Render a map with Bootstrap5 dark theme. */
+'Bootstrap5Dark';
 /**
  * Defines the position of the legend.
  */

package/src/maps/utils/helper.d.ts

@@ -742,7 +742,7 @@ export declare function getRatioOfBubble(min: number, max: number, value: number
  * @param {string} type - Specifies the type
  * @returns {any} - Specifies the object
  */
-export declare function findMidPointOfPolygon(points: MapLocation[], type: string): any;
+export declare function findMidPointOfPolygon(points: MapLocation[], type: string, geometryType?: string): any;
 /**
  * Check custom path
  *

package/src/maps/utils/helper.js

@@ -641,7 +641,7 @@ export function renderTextElement(option, style, color, parent, isMinus) {
         'opacity': style.opacity,
         'dominant-baseline': option.baseLine
     };
-    var text = typeof option.text === 'string' ? option.text : isMinus ? option.text[option.text.length - 1] : option.text[0];
+    var text = typeof option.text === 'string' || typeof option.text === 'number' ? option.text : isMinus ? option.text[option.text.length - 1] : option.text[0];
     var tspanElement;
     var renderer = new SvgRenderer('');
     var height;
@@ -1762,7 +1762,7 @@ export function getRatioOfBubble(min, max, value, minValue, maxValue) {
  * @returns {any} - Specifies the object
  */
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function findMidPointOfPolygon(points, type) {
+export function findMidPointOfPolygon(points, type, geometryType) {
     if (!points.length) {
         return null;
     }
@@ -1777,14 +1777,14 @@ export function findMidPointOfPolygon(points, type) {
     var ySum = 0;
     for (var 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)))));
@@ -1805,7 +1805,7 @@ export function findMidPointOfPolygon(points, type) {
     var height = 0;
     for (var i = min; i <= max - 1; i++) {
         var 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 };