@syncfusion/ej2-maps 20.3.56 → 20.4.38

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

@@ -16,8 +16,6 @@ var __extends$1 = (undefined && undefined.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-/* eslint-disable @typescript-eslint/no-unused-vars */
 /* eslint-disable max-len */
 /**
  * Helper functions for maps control
@@ -677,13 +675,14 @@ function convertElement(element, markerId, data, index, mapObj) {
     }
     var templateHtml = childElement.innerHTML;
     var properties = Object.keys(data);
+    var regExp = RegExp;
     for (var i = 0; i < properties.length; i++) {
         if (typeof data[properties[i]] === 'object') {
             templateHtml = convertStringToValue(templateHtml, '', data, mapObj);
             // eslint-disable-next-line @typescript-eslint/ban-types
         }
         else if (properties[i].toLowerCase() !== 'latitude' && properties[i].toLowerCase() !== 'longitude') {
-            templateHtml = templateHtml.replace(new RegExp('{{:' + properties[i] + '}}', 'g'), data[properties[i].toString()]);
+            templateHtml = templateHtml.replace(new regExp('{{:' + properties[i] + '}}', 'g'), data[properties[i].toString()]);
         }
     }
     childElement.innerHTML = templateHtml;
@@ -720,6 +719,7 @@ function formatValue(value, maps) {
 function convertStringToValue(stringTemplate, format, data, maps) {
     var templateHtml = (stringTemplate === '') ? format : stringTemplate;
     var templateValue = (stringTemplate === '') ? templateHtml.split('${') : templateHtml.split('{{:');
+    var regExp = RegExp;
     for (var i = 0; i < templateValue.length; i++) {
         if ((templateValue[i].indexOf('}}') > -1 && templateValue[i].indexOf('.') > -1) ||
             (templateValue[i].indexOf('}') > -1 && templateValue[i].search('.') > -1)) {
@@ -729,7 +729,7 @@ function convertStringToValue(stringTemplate, format, data, maps) {
                     var templateSplitValue = (getValueFromObject(data, split[j])).toString();
                     templateHtml = (stringTemplate === '') ?
                         templateHtml.split('${' + split[j] + '}').join(formatValue(templateSplitValue, maps)) :
-                        templateHtml.replace(new RegExp('{{:' + split[j] + '}}', 'g'), templateSplitValue);
+                        templateHtml.replace(new regExp('{{:' + split[j] + '}}', 'g'), templateSplitValue);
                 }
             }
         }
@@ -751,9 +751,10 @@ function convertElementFromLabel(element, labelId, data, index, mapObj) {
     var templateHtml = labelEle.outerHTML;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var properties = Object.keys(data);
+    var regExp = RegExp;
     for (var i = 0; i < properties.length; i++) {
         // eslint-disable-next-line @typescript-eslint/ban-types
-        templateHtml = templateHtml.replace(new RegExp('{{:' + properties[i] + '}}', 'g'), data[properties[i].toString()]);
+        templateHtml = templateHtml.replace(new regExp('{{:' + properties[i] + '}}', 'g'), data[properties[i].toString()]);
     }
     var templateEle = createElement('div', {
         id: labelId,
@@ -862,7 +863,7 @@ function markerShapeChoose(eventArgs, data) {
         var shape = ((eventArgs.shapeValuePath.indexOf('.') > -1) ?
             (getValueFromObject(data, eventArgs.shapeValuePath).toString()) :
             data[eventArgs.shapeValuePath]);
-        eventArgs.shape = (shape.toString() !== "") ? shape : eventArgs.shape;
+        eventArgs.shape = (shape.toString() !== '') ? shape : eventArgs.shape;
         if (data[eventArgs.shapeValuePath] === 'Image') {
             eventArgs.imageUrl = (!isNullOrUndefined(eventArgs.imageUrlValuePath)) ?
                 ((eventArgs.imageUrlValuePath.indexOf('.') > -1) ? getValueFromObject(data, eventArgs.imageUrlValuePath).toString() : (!isNullOrUndefined(data[eventArgs.imageUrlValuePath]) ?
@@ -871,7 +872,7 @@ function markerShapeChoose(eventArgs, data) {
     }
     else {
         var shapes = (!isNullOrUndefined(eventArgs.shapeValuePath)) ? ((eventArgs.shapeValuePath.indexOf('.') > -1) ? getValueFromObject(data, eventArgs.shapeValuePath).toString() : eventArgs.shape) : eventArgs.shape;
-        eventArgs.shape = (shapes.toString() !== "") ? shapes : eventArgs.shape;
+        eventArgs.shape = (shapes.toString() !== '') ? shapes : eventArgs.shape;
         var shapeImage = (!isNullOrUndefined(eventArgs.imageUrlValuePath)) ?
             ((eventArgs.imageUrlValuePath.indexOf('.') > -1) ? getValueFromObject(data, eventArgs.imageUrlValuePath).toString() : (!isNullOrUndefined(data[eventArgs.imageUrlValuePath]) ?
                 data[eventArgs.imageUrlValuePath] : eventArgs.imageUrl)) : eventArgs.imageUrl;
@@ -950,8 +951,6 @@ function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerC
                             container['top'] : (container['bottom'] - container['top'])));
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         var translate = (maps.isTileMap) ? new Object() : getTranslate(maps, currentLayer, false);
-                        var transPoint = (maps.isTileMap) ? { x: 0, y: 0 } : (maps.translatePoint.x !== 0) ?
-                            maps.translatePoint : translate['location'];
                         var dataIndex = parseInt(markerTemplate.childNodes[o]['id'].split('_dataIndex_')[1].split('_')[0], 10);
                         var markerIndex = parseInt(markerTemplate.childNodes[o]['id'].split('_MarkerIndex_')[1].split('_')[0], 10);
                         var markerSetting = currentLayer.markerSettings[markerIndex];
@@ -1600,6 +1599,7 @@ function drawStar(maps, options, size, location, element) {
  * @param {PathOption} options - Specifies the path options
  * @param {Size} size - Specifies the size
  * @param {MapLocation} location - Specifies the map location
+ * @param {string} type - Specifies the type.
  * @param {Element} element - Specifies the element
  * @returns {Element} - Returns the element
  * @private
@@ -2090,7 +2090,8 @@ function getTranslate(mapObject, layer, animate) {
                         mapObject.zoomTranslatePoint.y = y;
                     }
                     else {
-                        if (!isNullOrUndefined(mapObject.previousProjection) && (mapObject.mapScaleValue === 1 || mapObject.mapScaleValue <= 1.05) && !mapObject.zoomModule.isDragZoom) {
+                        if (!isNullOrUndefined(mapObject.previousProjection) && (mapObject.mapScaleValue === 1
+                            || mapObject.mapScaleValue <= 1.05) && !mapObject.zoomModule.isDragZoom) {
                             scaleFactor = parseFloat(Math.min(size.width / mapWidth, size.height / mapHeight).toFixed(2));
                             scaleFactor = scaleFactor > 1.05 ? 1 : scaleFactor;
                             mapWidth *= scaleFactor;
@@ -2108,8 +2109,10 @@ function getTranslate(mapObject, layer, animate) {
             }
         }
         if (!isNullOrUndefined(mapObject.translatePoint)) {
-            x = (mapObject.enablePersistence && mapObject.translatePoint.x !== 0 && !mapObject.zoomNotApplied) ? mapObject.translatePoint.x : x;
-            y = (mapObject.enablePersistence && mapObject.translatePoint.y !== 0 && !mapObject.zoomNotApplied) ? mapObject.translatePoint.y : y;
+            x = (mapObject.enablePersistence && mapObject.translatePoint.x !== 0 && !mapObject.zoomNotApplied) ?
+                mapObject.translatePoint.x : x;
+            y = (mapObject.enablePersistence && mapObject.translatePoint.y !== 0 && !mapObject.zoomNotApplied) ?
+                mapObject.translatePoint.y : y;
         }
     }
     scaleFactor = (mapObject.enablePersistence) ? ((mapObject.mapScaleValue >= 1) ? mapObject.mapScaleValue : 1) : scaleFactor;
@@ -2160,9 +2163,11 @@ function getZoomTranslate(mapObject, layer, animate) {
     mapObject.mapScaleValue = mapObject.zoomSettings.zoomFactor !== 1 &&
         mapObject.zoomSettings.zoomFactor ===
             mapObject.mapScaleValue ? mapObject.zoomSettings.zoomFactor :
-        mapObject.zoomSettings.zoomFactor !== mapObject.mapScaleValue && !mapObject.centerPositionChanged ? mapObject.mapScaleValue : mapObject.zoomSettings.zoomFactor;
+        mapObject.zoomSettings.zoomFactor !== mapObject.mapScaleValue && !mapObject.centerPositionChanged ?
+            mapObject.mapScaleValue : mapObject.zoomSettings.zoomFactor;
     if (mapObject.zoomSettings.shouldZoomInitially && !mapObject.isZoomByPosition) {
-        mapObject.mapScaleValue = zoomFactorValue = scaleFactor = ((mapObject.enablePersistence || mapObject.zoomSettings.shouldZoomInitially) && mapObject.scale === 1)
+        mapObject.mapScaleValue = zoomFactorValue = scaleFactor = ((mapObject.enablePersistence
+            || mapObject.zoomSettings.shouldZoomInitially) && mapObject.scale === 1)
             ? mapObject.scale : (isNullOrUndefined(mapObject.markerZoomFactor)) ? mapObject.mapScaleValue : mapObject.markerZoomFactor;
         zoomFactorValue = mapObject.mapScaleValue;
         if (!isNullOrUndefined(mapObject.markerCenterLatitude) && !isNullOrUndefined(mapObject.markerCenterLongitude)) {
@@ -2189,7 +2194,8 @@ function getZoomTranslate(mapObject, layer, animate) {
         var leftPosition = ((mapWidth + Math.abs(mapObject.mapAreaRect.width - mapWidth)) / 2) / factor;
         var point = checkZoomMethod ? calculateCenterFromPixel(mapObject, layer) :
             convertGeoToPoint(latitude, longitude, mapObject.mapLayerPanel.calculateFactor(layer), layer, mapObject);
-        if ((!isNullOrUndefined(mapObject.zoomTranslatePoint) || !isNullOrUndefined(mapObject.previousProjection)) && !mapObject.zoomNotApplied) {
+        if ((!isNullOrUndefined(mapObject.zoomTranslatePoint) || !isNullOrUndefined(mapObject.previousProjection)) &&
+            !mapObject.zoomNotApplied) {
             if (mapObject.previousProjection !== mapObject.projectionType) {
                 x = -point.x + leftPosition;
                 y = -point.y + topPosition;
@@ -2209,8 +2215,10 @@ function getZoomTranslate(mapObject, layer, animate) {
             y = -point.y + topPosition + mapObject.mapAreaRect.y / zoomFactor;
         }
         if (!isNullOrUndefined(mapObject.translatePoint)) {
-            y = (mapObject.enablePersistence && mapObject.translatePoint.y !== 0 && !mapObject.zoomNotApplied) ? mapObject.translatePoint.y : y;
-            x = (mapObject.enablePersistence && mapObject.translatePoint.x !== 0 && !mapObject.zoomNotApplied) ? mapObject.translatePoint.x : x;
+            y = (mapObject.enablePersistence && mapObject.translatePoint.y !== 0 && !mapObject.zoomNotApplied) ?
+                mapObject.translatePoint.y : y;
+            x = (mapObject.enablePersistence && mapObject.translatePoint.x !== 0 && !mapObject.zoomNotApplied) ?
+                mapObject.translatePoint.x : x;
         }
         scaleFactor = zoomFactorValue !== 0 ? zoomFactorValue : 1;
     }
@@ -2248,8 +2256,10 @@ function getZoomTranslate(mapObject, layer, animate) {
             }
         }
         if (!isNullOrUndefined(mapObject.translatePoint)) {
-            x = (mapObject.enablePersistence && mapObject.translatePoint.x !== 0 && !mapObject.zoomNotApplied) ? mapObject.translatePoint.x : leftPosition;
-            y = (mapObject.enablePersistence && mapObject.translatePoint.y !== 0 && !mapObject.zoomNotApplied) ? mapObject.translatePoint.y : topPosition;
+            x = (mapObject.enablePersistence && mapObject.translatePoint.x !== 0 && !mapObject.zoomNotApplied) ?
+                mapObject.translatePoint.x : leftPosition;
+            y = (mapObject.enablePersistence && mapObject.translatePoint.y !== 0 && !mapObject.zoomNotApplied) ?
+                mapObject.translatePoint.y : topPosition;
         }
     }
     scaleFactor = (mapObject.enablePersistence) ? (mapObject.mapScaleValue === 0 ? 1 : mapObject.mapScaleValue) : scaleFactor;
@@ -2314,6 +2324,7 @@ function Internalize(maps, value) {
  * Function to compile the template function for maps.
  *
  * @param {string} template - Specifies the template
+ * @param {Maps} maps - Specifies the Maps instance.
  * @returns {Function} - Returns the function
  * @private
  */
@@ -2321,10 +2332,10 @@ function Internalize(maps, value) {
 function getTemplateFunction(template, maps) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var templateFn = null;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     try {
         if (document.querySelectorAll(template).length) {
             templateFn = compile(document.querySelector(template).innerHTML.trim());
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
         }
         else if (maps.isVue || maps.isVue3) {
             templateFn = compile(template);
@@ -2529,7 +2540,8 @@ shapeData, data) {
         maps: map
     };
     map.trigger('itemSelection', eventArgs, function (observedArgs) {
-        eventArgs.border.opacity = isNullOrUndefined(selectionSettings.border.opacity) ? selectionSettings.opacity : selectionSettings.border.opacity;
+        eventArgs.border.opacity = isNullOrUndefined(selectionSettings.border.opacity) ? selectionSettings.opacity :
+            selectionSettings.border.opacity;
         map.shapeSelectionItem.push(eventArgs.shapeData);
         if (!getElement('ShapeselectionMap')) {
             document.body.appendChild(createStyle('ShapeselectionMap', 'ShapeselectionMapStyle', eventArgs));
@@ -2629,7 +2641,7 @@ function showTooltip(text, size, x, y, areaWidth, areaHeight, id, element, isTou
     var demo = str[0].length;
     for (var i = 1; i < str.length; i++) {
         if (demo < str[i].length) {
-            demo = str[i].length;
+            demo = (str[i]).length;
         }
     }
     if (!tooltip) {
@@ -2699,7 +2711,7 @@ function wordWrap(tooltip, text, x, y, size1, width, areaWidth, element) {
 //     if (touches) {
 //         touchList = [];
 //         for (let i: number = 0, length: number = touches.length; i < length; i++) {
-//             touchList.push({ pageX: touches[i].clientX, pageY: touches[i].clientY, pointerId: null });
+//             touchList.push({ pageX: touches[i as number].clientX, pageY: touches[i as number].clientY, pointerId: null });
 //         }
 //     } else {
 //         touchList = touchList ? touchList : [];
@@ -2707,8 +2719,8 @@ function wordWrap(tooltip, text, x, y, size1, width, areaWidth, element) {
 //             touchList.push({ pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId });
 //         } else {
 //             for (let i: number = 0, length: number = touchList.length; i < length; i++) {
-//                 if (touchList[i].pointerId === e.pointerId) {
-//                     touchList[i] = { pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId };
+//                 if (touchList[i as number].pointerId === e.pointerId) {
+//                     touchList[i as number] = { pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId };
 //                 } else {
 //                     touchList.push({ pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId });
 //                 }
@@ -3853,7 +3865,7 @@ var __decorate$1 = (undefined && undefined.__decorate) || function (decorators,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable max-len */
 /**
  * Maps base document
  */
@@ -4948,7 +4960,8 @@ var Marker = /** @__PURE__ @class */ (function () {
                     nullCount += (!isNaN(lat) && !isNaN(lng)) ? 0 : 1;
                     markerTemplateCount += (eventArgs.cancel) ? 1 : 0;
                     markerCount += (eventArgs.cancel) ? 1 : 0;
-                    maps.markerNullCount = (isNullOrUndefined(lng) || isNullOrUndefined(lat)) ? maps.markerNullCount + 1 : maps.markerNullCount;
+                    maps.markerNullCount = (isNullOrUndefined(lng) || isNullOrUndefined(lat)) ?
+                        maps.markerNullCount + 1 : maps.markerNullCount;
                     var markerDataLength = markerData.length - maps.markerNullCount;
                     if (_this.markerSVGObject.childElementCount === (markerDataLength - markerTemplateCount - nullCount) && (type !== 'Template')) {
                         layerElement.appendChild(_this.markerSVGObject);
@@ -5006,126 +5019,134 @@ var Marker = /** @__PURE__ @class */ (function () {
     };
     /**
      * To calculate center position and factor value dynamically
+     *
+     * @param {LayerSettings[]} layersCollection - Specifies the layer settings instance.
+     * @returns {void}
      */
     Marker.prototype.calculateZoomCenterPositionAndFactor = function (layersCollection) {
-        if (this.maps.zoomSettings.shouldZoomInitially && this.maps.markerModule) {
-            var minLong_1;
-            var maxLat_1;
-            var minLat_1;
-            var maxLong_1;
-            var zoomLevel = void 0;
-            var centerLat = void 0;
-            var centerLong = void 0;
-            var maxZoomFact = this.maps.zoomSettings.maxZoom;
-            var mapWidth = this.maps.mapAreaRect.width;
-            var mapHeight = this.maps.mapAreaRect.height;
-            this.maps.markerZoomedState = this.maps.markerZoomedState ? this.maps.markerZoomedState : isNullOrUndefined(this.maps.markerZoomFactor) ?
-                !this.maps.markerZoomedState : this.maps.markerZoomFactor > 1 ? this.maps.markerZoomedState : !this.maps.markerZoomedState;
-            this.maps.defaultState = this.maps.markerZoomedState ? !this.maps.markerZoomedState : this.maps.defaultState;
-            Array.prototype.forEach.call(layersCollection, function (currentLayer, layerIndex) {
-                var isMarker = currentLayer.markerSettings.length !== 0;
-                if (isMarker) {
-                    Array.prototype.forEach.call(currentLayer.markerSettings, function (markerSetting, markerIndex) {
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        var markerData = markerSetting.dataSource;
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        Array.prototype.forEach.call(markerData, function (data, dataIndex) {
-                            var latitude = !isNullOrUndefined(data['latitude']) ? parseFloat(data['latitude']) :
-                                !isNullOrUndefined(data['Latitude']) ? parseFloat(data['Latitude']) : null;
-                            var longitude = !isNullOrUndefined(data['longitude']) ? parseFloat(data['longitude']) :
-                                !isNullOrUndefined(data['Longitude']) ? parseFloat(data['Longitude']) : null;
-                            minLong_1 = isNullOrUndefined(minLong_1) && dataIndex === 0 ?
-                                longitude : minLong_1;
-                            maxLat_1 = isNullOrUndefined(maxLat_1) && dataIndex === 0 ?
-                                latitude : maxLat_1;
-                            minLat_1 = isNullOrUndefined(minLat_1) && dataIndex === 0 ?
-                                latitude : minLat_1;
-                            maxLong_1 = isNullOrUndefined(maxLong_1) && dataIndex === 0 ?
-                                longitude : maxLong_1;
-                            if (minLong_1 > longitude) {
-                                minLong_1 = longitude;
-                            }
-                            if (minLat_1 > latitude) {
-                                minLat_1 = latitude;
-                            }
-                            if (maxLong_1 < longitude) {
-                                maxLong_1 = longitude;
-                            }
-                            if (maxLat_1 < latitude) {
-                                maxLat_1 = latitude;
-                            }
+        if (!isNullOrUndefined(this.maps)) {
+            if (this.maps.zoomSettings.shouldZoomInitially && this.maps.markerModule) {
+                var minLong_1;
+                var maxLat_1;
+                var minLat_1;
+                var maxLong_1;
+                var zoomLevel = void 0;
+                var centerLat = void 0;
+                var centerLong = void 0;
+                var maxZoomFact = this.maps.zoomSettings.maxZoom;
+                var mapWidth = this.maps.mapAreaRect.width;
+                var mapHeight = this.maps.mapAreaRect.height;
+                this.maps.markerZoomedState = this.maps.markerZoomedState ? this.maps.markerZoomedState :
+                    isNullOrUndefined(this.maps.markerZoomFactor) ? !this.maps.markerZoomedState :
+                        this.maps.markerZoomFactor > 1 ? this.maps.markerZoomedState : !this.maps.markerZoomedState;
+                this.maps.defaultState = this.maps.markerZoomedState ? !this.maps.markerZoomedState : this.maps.defaultState;
+                Array.prototype.forEach.call(layersCollection, function (currentLayer) {
+                    var isMarker = currentLayer.markerSettings.length !== 0;
+                    if (isMarker) {
+                        Array.prototype.forEach.call(currentLayer.markerSettings, function (markerSetting) {
+                            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                            var markerData = markerSetting.dataSource;
+                            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                            Array.prototype.forEach.call(markerData, function (data, dataIndex) {
+                                var latitude = !isNullOrUndefined(data['latitude']) ? parseFloat(data['latitude']) :
+                                    !isNullOrUndefined(data['Latitude']) ? parseFloat(data['Latitude']) : null;
+                                var longitude = !isNullOrUndefined(data['longitude']) ? parseFloat(data['longitude']) :
+                                    !isNullOrUndefined(data['Longitude']) ? parseFloat(data['Longitude']) : null;
+                                minLong_1 = isNullOrUndefined(minLong_1) && dataIndex === 0 ?
+                                    longitude : minLong_1;
+                                maxLat_1 = isNullOrUndefined(maxLat_1) && dataIndex === 0 ?
+                                    latitude : maxLat_1;
+                                minLat_1 = isNullOrUndefined(minLat_1) && dataIndex === 0 ?
+                                    latitude : minLat_1;
+                                maxLong_1 = isNullOrUndefined(maxLong_1) && dataIndex === 0 ?
+                                    longitude : maxLong_1;
+                                if (minLong_1 > longitude) {
+                                    minLong_1 = longitude;
+                                }
+                                if (minLat_1 > latitude) {
+                                    minLat_1 = latitude;
+                                }
+                                if (maxLong_1 < longitude) {
+                                    maxLong_1 = longitude;
+                                }
+                                if (maxLat_1 < latitude) {
+                                    maxLat_1 = latitude;
+                                }
+                            });
                         });
-                    });
-                }
-            });
-            if (!isNullOrUndefined(minLat_1) && !isNullOrUndefined(minLong_1) &&
-                !isNullOrUndefined(maxLong_1) && !isNullOrUndefined(maxLat_1)) {
-                // To find the center position
-                centerLat = (minLat_1 + maxLat_1) / 2;
-                centerLong = (minLong_1 + maxLong_1) / 2;
-                this.maps.markerCenterLatitude = centerLat;
-                this.maps.markerCenterLongitude = centerLong;
-                if (isNullOrUndefined(this.maps.markerZoomCenterPoint) || this.maps.markerZoomedState) {
-                    this.maps.markerZoomCenterPoint = {
-                        latitude: centerLat,
-                        longitude: centerLong
-                    };
-                }
-                var markerFactor = void 0;
-                if (this.maps.isTileMap || this.maps.baseMapRectBounds['min']['x'] === 0) {
-                    zoomLevel = calculateZoomLevel(minLat_1, maxLat_1, minLong_1, maxLong_1, mapWidth, mapHeight, this.maps);
-                    if (this.maps.isTileMap) {
-                        markerFactor = isNullOrUndefined(this.maps.markerZoomFactor) ?
-                            zoomLevel : isNullOrUndefined(this.maps.mapScaleValue) ?
-                            zoomLevel : this.maps.mapScaleValue > 1 && this.maps.markerZoomFactor !== 1 ?
-                            this.maps.mapScaleValue : zoomLevel;
+                    }
+                });
+                if (!isNullOrUndefined(minLat_1) && !isNullOrUndefined(minLong_1) &&
+                    !isNullOrUndefined(maxLong_1) && !isNullOrUndefined(maxLat_1)) {
+                    // To find the center position
+                    centerLat = (minLat_1 + maxLat_1) / 2;
+                    centerLong = (minLong_1 + maxLong_1) / 2;
+                    this.maps.markerCenterLatitude = centerLat;
+                    this.maps.markerCenterLongitude = centerLong;
+                    if (isNullOrUndefined(this.maps.markerZoomCenterPoint) || this.maps.markerZoomedState) {
+                        this.maps.markerZoomCenterPoint = {
+                            latitude: centerLat,
+                            longitude: centerLong
+                        };
+                    }
+                    var markerFactor = void 0;
+                    if (this.maps.isTileMap || this.maps.baseMapRectBounds['min']['x'] === 0) {
+                        zoomLevel = calculateZoomLevel(minLat_1, maxLat_1, minLong_1, maxLong_1, mapWidth, mapHeight, this.maps);
+                        if (this.maps.isTileMap) {
+                            markerFactor = isNullOrUndefined(this.maps.markerZoomFactor) ?
+                                zoomLevel : isNullOrUndefined(this.maps.mapScaleValue) ?
+                                zoomLevel : this.maps.mapScaleValue > 1 && this.maps.markerZoomFactor !== 1 ?
+                                this.maps.mapScaleValue : zoomLevel;
+                        }
+                        else {
+                            markerFactor = isNullOrUndefined(this.maps.mapScaleValue) ? zoomLevel :
+                                (Math.floor(this.maps.scale) !== 1 &&
+                                    this.maps.mapScaleValue !== zoomLevel)
+                                    &&
+                                        (isNullOrUndefined(this.maps.shouldZoomCurrentFactor))
+                                    ? this.maps.mapScaleValue : zoomLevel;
+                            if (((markerFactor === this.maps.mapScaleValue &&
+                                (this.maps.markerZoomFactor === 1 || this.maps.mapScaleValue === 1))
+                                && (!this.maps.enablePersistence))) {
+                                markerFactor = zoomLevel;
+                            }
+                        }
                     }
                     else {
+                        zoomLevel = this.calculateIndividualLayerMarkerZoomLevel(mapWidth, mapHeight, maxZoomFact);
                         markerFactor = isNullOrUndefined(this.maps.mapScaleValue) ? zoomLevel :
-                            (Math.floor(this.maps.scale) !== 1 &&
-                                this.maps.mapScaleValue !== zoomLevel)
-                                &&
-                                    (isNullOrUndefined(this.maps.shouldZoomCurrentFactor))
+                            (this.maps.mapScaleValue !== zoomLevel)
                                 ? this.maps.mapScaleValue : zoomLevel;
-                        if (((markerFactor === this.maps.mapScaleValue &&
-                            (this.maps.markerZoomFactor === 1 || this.maps.mapScaleValue === 1))
-                            && (!this.maps.enablePersistence))) {
-                            markerFactor = zoomLevel;
-                        }
                     }
+                    this.maps.markerZoomFactor = markerFactor;
                 }
-                else {
-                    zoomLevel = this.calculateIndividualLayerMarkerZoomLevel(mapWidth, mapHeight, maxZoomFact);
-                    markerFactor = isNullOrUndefined(this.maps.mapScaleValue) ? zoomLevel :
-                        (this.maps.mapScaleValue !== zoomLevel)
-                            ? this.maps.mapScaleValue : zoomLevel;
-                }
-                this.maps.markerZoomFactor = markerFactor;
             }
-        }
-        else {
-            this.maps.markerZoomedState = false;
-            if (this.maps.markerZoomFactor > 1) {
-                this.maps.markerCenterLatitude = null;
-                this.maps.markerCenterLongitude = null;
-                this.maps.markerZoomFactor = 1;
-                if (!this.maps.enablePersistence) {
-                    this.maps.mapScaleValue = 1;
+            else {
+                this.maps.markerZoomedState = false;
+                if (this.maps.markerZoomFactor > 1) {
+                    this.maps.markerCenterLatitude = null;
+                    this.maps.markerCenterLongitude = null;
+                    this.maps.markerZoomFactor = 1;
+                    if (!this.maps.enablePersistence) {
+                        this.maps.mapScaleValue = 1;
+                    }
                 }
-            }
-            if (this.maps.isTileMap && !this.maps.enablePersistence
-                && this.maps.mapScaleValue <= 1) {
-                this.maps.tileZoomLevel = this.maps.mapScaleValue === 0 ? (this.maps.isZoomByPosition ? this.maps.tileZoomLevel : 1)
-                    : this.maps.mapScaleValue;
-                if (this.maps.mapScaleValue === 1 && this.maps.markerZoomFactor === 1) {
-                    this.maps.tileTranslatePoint.x = 0;
-                    this.maps.tileTranslatePoint.y = 0;
+                if (this.maps.isTileMap && !this.maps.enablePersistence
+                    && this.maps.mapScaleValue <= 1) {
+                    this.maps.tileZoomLevel = this.maps.mapScaleValue === 0 ? (this.maps.isZoomByPosition ? this.maps.tileZoomLevel : 1)
+                        : this.maps.mapScaleValue;
+                    if (this.maps.mapScaleValue === 1 && this.maps.markerZoomFactor === 1) {
+                        this.maps.tileTranslatePoint.x = 0;
+                        this.maps.tileTranslatePoint.y = 0;
+                    }
                 }
             }
         }
     };
     /**
      * To check and trigger marker click event
+     * @param {PointerEvent} e - Specifies the pointer event argument.
+     * @returns {void}
      */
     Marker.prototype.markerClick = function (e) {
         var target = e.target.id;
@@ -5147,6 +5168,8 @@ var Marker = /** @__PURE__ @class */ (function () {
     };
     /**
      * To check and trigger Cluster click event
+     * @param {PointerEvent} e - Specifies the pointer event argument.
+     * @returns {void}
      */
     Marker.prototype.markerClusterClick = function (e) {
         var target = e.target.id;
@@ -5238,6 +5261,9 @@ var Marker = /** @__PURE__ @class */ (function () {
     };
     /**
      * To check and trigger marker move event
+     *
+     * @param {PointerEvent} e - Specifies the pointer event argument.
+     * @returns {void}
      */
     Marker.prototype.markerMove = function (e) {
         var targetId = e.target.id;
@@ -5256,6 +5282,9 @@ var Marker = /** @__PURE__ @class */ (function () {
     };
     /**
      * To check and trigger cluster move event
+     *
+     * @param {PointerEvent} e - Specifies the pointer event argument.
+     * @returns {void}
      */
     Marker.prototype.markerClusterMouseMove = function (e) {
         var targetId = e.target.id;
@@ -5529,6 +5558,7 @@ var BingMap = /** @__PURE__ @class */ (function () {
         }
     };
     /**
+     * @returns {void}
      * @private
      */
     BingMap.prototype.destroy = function () {
@@ -5566,6 +5596,11 @@ var ColorMapping = /** @__PURE__ @class */ (function () {
     };
     /**
      * To color by value and color mapping
+     *
+     * @param {ColorMappingSettingsModel[]} colorMapping - Specifies the color mapping instance.
+     * @param {number} colorValue - Specifies the color value
+     * @param {string} equalValue - Specifies the equal value.
+     * @returns {any} - Returns the color mapping values.
      */
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     ColorMapping.prototype.getColorByValue = function (colorMapping, colorValue, equalValue) {
@@ -5758,10 +5793,7 @@ var ColorMapping = /** @__PURE__ @class */ (function () {
     return ColorMapping;
 }());
 
-/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-/* eslint-disable jsdoc/require-param */
 /* eslint-disable no-case-declarations */
-/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * To calculate and render the shape layer
  */
@@ -5950,7 +5982,10 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
             panel.mapObject.previousZoomFactor = panel.mapObject.zoomSettings.zoomFactor;
         }
         if (panel.mapObject.navigationLineModule) {
-            panel.layerObject.appendChild(panel.mapObject.navigationLineModule.renderNavigation(panel.currentLayer, panel.mapObject.tileZoomLevel, layerIndex));
+            var navigationLineElement = panel.mapObject.navigationLineModule.renderNavigation(panel.currentLayer, panel.mapObject.tileZoomLevel, layerIndex);
+            if (!isNullOrUndefined(navigationLineElement)) {
+                panel.layerObject.appendChild(navigationLineElement);
+            }
         }
         if (panel.mapObject.markerModule) {
             panel.mapObject.markerModule.markerRender(this.mapObject, panel.layerObject, layerIndex, panel.mapObject.tileZoomLevel, null);
@@ -6018,7 +6053,6 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                             var imageUrl = resource['imageUrl'];
                             var subDomains = resource['imageUrlSubdomains'];
                             var maxZoom = resource['zoomMax'];
-                            var markerGroupElement = document.getElementById(proxy_1.mapObject.element.id + '_Markers_Group');
                             if (imageUrl !== null && imageUrl !== undefined && imageUrl !== bing_1.imageUrl) {
                                 bing_1.imageUrl = imageUrl;
                             }
@@ -6180,8 +6214,6 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                 fill = Object.prototype.toString.call(getShapeColor_1) === '[object Object]' && !isNullOrUndefined(getShapeColor_1['fill'])
                     ? getShapeColor_1['fill'] : fill;
                 if (this_1.currentLayer.shapeSettings.borderColorValuePath || this_1.currentLayer.shapeSettings.borderWidthValuePath) {
-                    var borderColorValue = this_1.currentLayer.shapeSettings.borderColorValuePath;
-                    var borderWidthValue = this_1.currentLayer.shapeSettings.borderWidthValuePath;
                     k = checkShapeDataFields(
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     this_1.currentLayer.dataSource, currentShapeData['property'], this_1.currentLayer.shapeDataPath, this_1.currentLayer.shapePropertyPath, this_1.currentLayer);
@@ -6308,7 +6340,9 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                         case 'Point':
                             // eslint-disable-next-line @typescript-eslint/no-explicit-any
                             var pointData = currentShapeData['point'];
-                            var circleRadius = (_this.mapObject.layers[layerIndex].type !== 'SubLayer') ? shapeSettings.circleRadius : shapeSettings.circleRadius / (_this.mapObject.isTileMap ? _this.mapObject.scale : _this.currentFactor);
+                            var circleRadius = (_this.mapObject.layers[layerIndex].type !== 'SubLayer') ?
+                                shapeSettings.circleRadius : shapeSettings.circleRadius / (_this.mapObject.isTileMap ?
+                                _this.mapObject.scale : _this.currentFactor);
                             circleOptions = new CircleOption(shapeID, eventArgs.fill, eventArgs.border, opacity, pointData['x'], pointData['y'], circleRadius, shapeSettings.dashArray);
                             pathEle = _this.mapObject.renderer.drawCircle(circleOptions);
                             break;
@@ -6318,7 +6352,7 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                                 var pointData = multiPointData['point'];
                                 var circleRadius = (_this.mapObject.layers[layerIndex].type !== 'SubLayer') ? shapeSettings.circleRadius : shapeSettings.circleRadius / (_this.mapObject.isTileMap ? _this.mapObject.scale : _this.currentFactor);
-                                circleOptions = new CircleOption((shapeID + "_multiLine_" + index), eventArgs.fill, eventArgs.border, opacity, pointData['x'], pointData['y'], circleRadius, shapeSettings.dashArray);
+                                circleOptions = new CircleOption((shapeID + '_multiLine_' + index), eventArgs.fill, eventArgs.border, opacity, pointData['x'], pointData['y'], circleRadius, shapeSettings.dashArray);
                                 pathEle = _this.mapObject.renderer.drawCircle(circleOptions);
                                 _this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData, i);
                             });
@@ -6351,15 +6385,16 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
     /**
      * layer features as bubble, marker, datalabel, navigation line.
      *
-     * @param {groupElement} Element - Specifies the element to append the group
-     * @param {pathEle} Element - Specifies the svg element
-     * @param {drawingType} string - Specifies the data type
-     * @param {currentShapeData} any - Specifies the layer of shapedata.
-     * @param {index} number - Specifies the tab index.
+     * @param {Element} groupElement - Specifies the element to append the group.
+     * @param {Element} pathEle - Specifies the svg element.
+     * @param {string} drawingType - Specifies the data type.
+     * @param {any} currentShapeData - Specifies the layer of shapedata.
+     * @param {number} index - Specifies the tab index.
      * @returns {void}
      */
+    LayerPanel.prototype.pathAttributeCalculate = function (groupElement, pathEle, drawingType, 
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    LayerPanel.prototype.pathAttributeCalculate = function (groupElement, pathEle, drawingType, currentShapeData, index) {
+    currentShapeData, index) {
         var property = (Object.prototype.toString.call(this.currentLayer.shapePropertyPath) === '[object Array]' ?
             this.currentLayer.shapePropertyPath : [this.currentLayer.shapePropertyPath]);
         var properties;
@@ -6386,7 +6421,7 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                     pathEle.setAttribute('stroke', styleProperty.border.color);
                     pathEle.setAttribute('fill-opacity', (styleProperty.opacity).toString());
                     pathEle.setAttribute('stroke-opacity', (isNullOrUndefined(styleProperty.border.opacity) ? styleProperty.opacity : styleProperty.border.opacity).toString());
-                    pathEle.setAttribute('stroke-width', (styleProperty.border.width).toString());
+                    pathEle.setAttribute('stroke-width', (isNullOrUndefined(styleProperty.border.width) ? 0 : styleProperty.border.width).toString());
                 }
             }
         }
@@ -6452,8 +6487,8 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
             _this.layerObject.appendChild(element);
         });
         if (this.mapObject.markerModule) {
-            this.mapObject.markerModule.markerRender(this.mapObject, this.layerObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor)
-                : this.currentFactor), null);
+            this.mapObject.markerModule.markerRender(this.mapObject, this.layerObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor) :
+                this.currentFactor), null);
         }
         this.translateLayerElements(this.layerObject, layerIndex);
         this.layerGroup.appendChild(this.layerObject);
@@ -6463,11 +6498,11 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
      *
      * @param {LayerSettings} layer - Specifies the layer
      * @param {number} layerIndex - Specifies the layer index
-     * @param {object[]} shape - Specifies the shape
+     * @param {any[]} shape - Specifies the shape
      * @param {Element} group - Specifies the group
      * @param {number} shapeIndex - Specifies the shape index
      * @param {HTMLElement} labelTemplateEle - Specifies the label template element
-     * @param {object[]} intersect - Specifies the intersect
+     * @param {any[]} intersect - Specifies the intersect
      * @returns {void}
      */
     LayerPanel.prototype.renderLabel = function (layer, layerIndex, 
@@ -6566,10 +6601,12 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var multiPolygonDatas = [];
                 for (var i = 0; i < coordinates.length; i++) {
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    newData = this.calculatePolygonBox(coordinates[i][0], data, properties);
-                    if (newData.length > 0) {
-                        multiPolygonDatas.push(newData);
+                    for (var j = 0; j < coordinates[i].length; j++) {
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                        newData = this.calculatePolygonBox(coordinates[i][j], data, properties);
+                        if (newData.length > 0) {
+                            multiPolygonDatas.push(newData);
+                        }
                     }
                 }
                 multiPolygonDatas['property'] = properties;
@@ -6578,15 +6615,15 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                 this.currentLayer.layerData.push(multiPolygonDatas);
                 break;
             case 'linestring':
-                var extraSpace_1 = !isNullOrUndefined(this.currentLayer.shapeSettings.border.width) ?
+                var lineExtraSpace_1 = !isNullOrUndefined(this.currentLayer.shapeSettings.border.width) ?
                     (typeof (this.currentLayer.shapeSettings.border.width) === 'string' ?
                         parseInt(this.currentLayer.shapeSettings.border.width, 10) : this.currentLayer.shapeSettings.border.width) : 1;
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                coordinates.map(function (points, index) {
+                coordinates.map(function (points) {
                     latitude = points[1];
                     longitude = points[0];
                     var point = convertGeoToPoint(latitude, longitude, _this.currentFactor, _this.currentLayer, _this.mapObject);
-                    _this.calculateBox(point, extraSpace_1);
+                    _this.calculateBox(point, lineExtraSpace_1);
                     newData.push({
                         point: point, lat: latitude, lng: longitude
                     });
@@ -6599,10 +6636,12 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                 var extraSpaces_1 = !isNullOrUndefined(this.currentLayer.shapeSettings.border.width) ?
                     (typeof (this.currentLayer.shapeSettings.border.width) === 'string' ?
                         parseInt(this.currentLayer.shapeSettings.border.width, 10) : this.currentLayer.shapeSettings.border.width) : 1;
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var multiLineData_1 = [];
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 coordinates.map(function (multiPoints) {
                     newData = [];
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     multiPoints.map(function (points) {
                         latitude = points[1];
                         longitude = points[0];
@@ -6631,8 +6670,8 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                     point: point, type: type, lat: latitude, lng: longitude, property: properties
                 });
                 break;
-            case 'multipoint': {
-                var extraSpace_2 = (!isNullOrUndefined(this.currentLayer.shapeSettings.border.width) ?
+            case 'multipoint':
+                var extraSpace_1 = (!isNullOrUndefined(this.currentLayer.shapeSettings.border.width) ?
                     (typeof (this.currentLayer.shapeSettings.border.width) === 'string' ?
                         parseInt(this.currentLayer.shapeSettings.border.width, 10) : this.currentLayer.shapeSettings.border.width) : 1) +
                     (this.currentLayer.shapeSettings.circleRadius * 2);
@@ -6642,7 +6681,7 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                     latitude = points[1];
                     longitude = points[0];
                     var point = convertGeoToPoint(latitude, longitude, _this.currentFactor, _this.currentLayer, _this.mapObject);
-                    _this.calculateBox(point, extraSpace_2);
+                    _this.calculateBox(point, extraSpace_1);
                     newData.push({
                         point: point, lat: latitude, lng: longitude
                     });
@@ -6651,7 +6690,6 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                 newData['type'] = type;
                 this.currentLayer.layerData.push(newData);
                 break;
-            }
             case 'path':
                 this.currentLayer.layerData.push({
                     point: data['d'], type: type, property: properties
@@ -6661,7 +6699,8 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
     };
     LayerPanel.prototype.calculateBox = function (point, extraSpace) {
         if (isNullOrUndefined(this.rectBounds)) {
-            this.rectBounds = { min: { x: point.x - extraSpace, y: point.y - extraSpace }, max: { x: point.x + extraSpace, y: point.y + extraSpace } };
+            this.rectBounds = { min: { x: point.x - extraSpace, y: point.y - extraSpace }, max: { x: point.x + extraSpace,
+                    y: point.y + extraSpace } };
         }
         else {
             this.rectBounds['min']['x'] = Math.min(this.rectBounds['min']['x'], point.x - extraSpace);
@@ -6785,6 +6824,7 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                     case 'multilinestring':
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         coordinates.map(function (multiPoint, index) {
+                            // eslint-disable-next-line @typescript-eslint/no-explicit-any
                             multiPoint.map(function (point, index) {
                                 _this.calculateRectBox(point, 'multilinestring', index === 0 ? true : false);
                             });
@@ -6800,6 +6840,7 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                         _this.calculateRectBox(coordinates, 'point');
                         break;
                     case 'multipoint':
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         coordinates.map(function (point, index) {
                             _this.calculateRectBox(point, 'multipoint', index === 0 ? true : false);
                         });
@@ -6815,7 +6856,7 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
         var newData = [];
         var bounds = this.mapObject.baseMapBounds;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        coordinates.map(function (currentPoint, index) {
+        coordinates.map(function (currentPoint) {
             var latitude = currentPoint[1];
             var longitude = currentPoint[0];
             if ((longitude >= bounds.longitude.min && longitude <= bounds.longitude.max)
@@ -6909,8 +6950,8 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                             tileI = (tileI % ycount) + ycount;
                         }
                         var tile = new Tile(tileI % ycount, j);
-                        tile.left = x;
-                        tile.top = y;
+                        tile.left = Math.round(x);
+                        tile.top = Math.round(y);
                         if (baseLayer.layerType === 'Bing' || (bing && !isNullOrUndefined(baseLayer.urlTemplate) && baseLayer.urlTemplate !== '')) {
                             var key = baseLayer.key;
                             tile.src = bing.getBingMap(tile, key, baseLayer.bingMapType, userLang, bing.imageUrl, bing.subDomains);
@@ -7004,18 +7045,45 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                         animateElement = element ? element.children[0] : null;
                     }
                 }
-                var id = 0;
-                var _loop_3 = function (tile) {
-                    var imgElement = createElement('img');
-                    imgElement.setAttribute('height', '256px');
-                    imgElement.setAttribute('width', '256px');
-                    imgElement.setAttribute('src', tile.src);
-                    imgElement.setAttribute('alt', _this.mapObject.getLocalizedLabel('ImageNotFound'));
+                for (var id = 0; id < _this.tiles.length; id++) {
+                    var tile = _this.tiles[id];
+                    var imgElement = null;
                     var mapId = _this.mapObject.element.id;
-                    imgElement.onload = function () {
-                        if (document.getElementById(mapId + '_tile_' + id) && type === 'Pan') {
-                            removeElement(mapId + '_tile_' + id);
+                    if (type === 'Pan') {
+                        var child = document.getElementById(mapId + '_tile_' + id);
+                        var isNewTile = false;
+                        if (isNullOrUndefined(child)) {
+                            isNewTile = true;
+                            child = createElement('div', { id: mapId + '_tile_' + id });
+                            imgElement = createElement('img');
+                        }
+                        else {
+                            child.style.removeProperty('display');
+                            imgElement = child.children[0];
                         }
+                        if (!isNewTile && imgElement && imgElement.src !== tile.src) {
+                            imgElement.src = tile.src;
+                        }
+                        child.style.position = 'absolute';
+                        child.style.left = tile.left + 'px';
+                        child.style.top = tile.top + 'px';
+                        child.style.height = tile.height + 'px';
+                        child.style.width = tile.width + 'px';
+                        if (isNewTile) {
+                            imgElement.setAttribute('height', '256px');
+                            imgElement.setAttribute('width', '256px');
+                            imgElement.setAttribute('src', tile.src);
+                            imgElement.setAttribute('alt', _this.mapObject.getLocalizedLabel('ImageNotFound'));
+                            child.appendChild(imgElement);
+                            animateElement.appendChild(child);
+                        }
+                    }
+                    else {
+                        imgElement = createElement('img');
+                        imgElement.setAttribute('height', '256px');
+                        imgElement.setAttribute('width', '256px');
+                        imgElement.setAttribute('src', tile.src);
+                        imgElement.setAttribute('alt', _this.mapObject.getLocalizedLabel('ImageNotFound'));
                         var child = createElement('div', { id: mapId + '_tile_' + id });
                         child.style.position = 'absolute';
                         child.style.left = tile.left + 'px';
@@ -7026,15 +7094,27 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
                         if (animateElement) {
                             animateElement.appendChild(child);
                         }
-                        id++;
-                        if (id === _this.tiles.length && document.getElementById(_this.mapObject.element.id + '_animated_tiles_old')) {
-                            removeElement(_this.mapObject.element.id + '_animated_tiles_old');
+                    }
+                    if (id === (_this.tiles.length - 1) && document.getElementById(_this.mapObject.element.id + '_animated_tiles_old')) {
+                        removeElement(_this.mapObject.element.id + '_animated_tiles_old');
+                    }
+                }
+                if (!isNullOrUndefined(_this.mapObject.currentTiles)) {
+                    for (var l = _this.tiles.length; l < animateElement.childElementCount; l++) {
+                        var isExistingElement = false;
+                        for (var a = 0; a < _this.mapObject.currentTiles.childElementCount; a++) {
+                            if (!isExistingElement &&
+                                _this.mapObject.currentTiles.children[a].id === animateElement.children[l].id) {
+                                isExistingElement = true;
+                            }
                         }
-                    };
-                };
-                for (var _i = 0, _a = _this.tiles; _i < _a.length; _i++) {
-                    var tile = _a[_i];
-                    _loop_3(tile);
+                        if (isExistingElement) {
+                            animateElement.children[l].style.display = 'none';
+                        }
+                        else {
+                            animateElement.removeChild(animateElement.children[l]);
+                        }
+                    }
                 }
             }, timeOut);
         }
@@ -7204,8 +7284,6 @@ var LayerPanel = /** @__PURE__ @class */ (function () {
     return LayerPanel;
 }());
 
-/* eslint-disable @typescript-eslint/no-unused-vars */
-/* eslint-disable jsdoc/require-param */
 /**
  * Represents the annotation elements for map.
  */
@@ -7345,11 +7423,6 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-/* eslint-disable @typescript-eslint/no-unused-vars */
-/* eslint-disable radix */
-/* eslint-disable max-len */
-/* eslint-disable valid-jsdoc */
 /**
  * Maps Component file
  */
@@ -7533,18 +7606,20 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
         this.setCulture();
     };
     Maps.prototype.renderElements = function () {
-        this.trigger(load, { maps: this });
-        this.createSVG();
-        this.findBaseAndSubLayers();
-        this.createSecondaryElement();
-        this.addTabIndex();
-        this.themeStyle = getThemeStyle(this.theme);
-        this.renderBorder();
-        this.renderTitle(this.titleSettings, 'title', null, null);
-        this.renderArea();
-        this.processRequestJsonData();
-        this.renderComplete();
-        this.isAddLayer = !this.isTileMap ? false : this.isAddLayer;
+        if (!this.isDestroyed) {
+            this.trigger(load, { maps: this });
+            this.createSVG();
+            this.findBaseAndSubLayers();
+            this.createSecondaryElement();
+            this.addTabIndex();
+            this.themeStyle = getThemeStyle(this.theme);
+            this.renderBorder();
+            this.renderTitle(this.titleSettings, 'title', null, null);
+            this.renderArea();
+            this.processRequestJsonData();
+            this.renderComplete();
+            this.isAddLayer = !this.isTileMap ? false : this.isAddLayer;
+        }
     };
     /**
      * To Initialize the control rendering.
@@ -7594,7 +7669,8 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
                     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 : new Query();
+                        queryModule = layer.markerSettings[i].query instanceof Query ?
+                            layer.markerSettings[i].query : new Query();
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         var dataManager = dataModule.executeQuery(queryModule);
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -7613,7 +7689,8 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
                     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 : new Query();
+                        queryModule = layer.bubbleSettings[i].query instanceof Query ?
+                            layer.bubbleSettings[i].query : new Query();
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         var dataManager = dataModule.executeQuery(queryModule);
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -7723,6 +7800,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
             }
             if (!this.isResize) {
                 for (var k = 0; k < this.layers[i].markerSettings.length; k++) {
+                    // eslint-disable-next-line max-len
                     if (this.layers[i].markerSettings[k].selectionSettings && this.layers[i].markerSettings[k].selectionSettings.enable
                         && this.layers[i].markerSettings[k].initialMarkerSelection.length > 0) {
                         var markerSelectionValues = this.layers[i].markerSettings[k].initialMarkerSelection;
@@ -7918,8 +7996,10 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
             tileSvgParentElement.style.left = left + 'px';
             tileSvgParentElement.style.top = top + 'px';
             if (!isNullOrUndefined(this.legendModule) && this.legendModule.totalPages.length > 0) {
-                tileElement.style.width = tileSvgElement.style.width = this.legendModule.legendTotalRect.width.toString();
-                tileElement.style.height = tileSvgElement.style.height = this.legendModule.legendTotalRect.height.toString();
+                tileElement.style.width = tileSvgElement.style.width =
+                    this.legendModule.legendTotalRect.width.toString();
+                tileElement.style.height = tileSvgElement.style.height =
+                    this.legendModule.legendTotalRect.height.toString();
                 tileSvgParentElement.style.width = this.legendModule.legendTotalRect.width + 'px';
                 tileSvgParentElement.style.height = this.legendModule.legendTotalRect.height + 'px';
             }
@@ -7940,7 +8020,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
             if (!isNullOrUndefined(elements) && elements.childElementCount > 0) {
                 for (var i = 0; i < elements.childNodes.length; i++) {
                     var childElement = elements.childNodes[i];
-                    if (childElement.tagName === 'g' && childElement.id.indexOf('_Legend_Group') == -1) {
+                    if (childElement.tagName === 'g' && childElement.id.indexOf('_Legend_Group') === -1) {
                         var layerIndex = parseFloat(childElement.id.split('_LayerIndex_')[1].split('_')[0]);
                         for (var j = 0; j < childElement.childNodes.length; j++) {
                             var childNode = childElement.childNodes[j];
@@ -8071,7 +8151,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
                 break;
             }
         }
-        subLayers.map(function (subLayer, subLayerIndex) {
+        subLayers.map(function (subLayer) {
             if (subLayer.visible) {
                 _this.layersCollection.push(subLayer);
             }
@@ -8231,6 +8311,9 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     Maps.prototype.keyUpHandler = function (event) {
         var id = event.target['id'];
+        if (this.isTileMap) {
+            this.removeTileMap();
+        }
         if (event.code === 'Tab' && id.indexOf('_LayerIndex_') > -1 && id.indexOf('shapeIndex') > -1) {
             this.keyboardHighlightSelection(id, event.type);
         }
@@ -8264,6 +8347,13 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     Maps.prototype.keyDownHandler = function (event) {
         var zoom = this.zoomModule;
+        if ((event.code === 'ArrowUp' || event.code === 'ArrowDown' || event.code === 'ArrowLeft'
+            || event.code === 'ArrowRight') && zoom) {
+            var animatedTiles = document.getElementById(this.element.id + '_animated_tiles');
+            if (this.isTileMap && !isNullOrUndefined(animatedTiles)) {
+                this.currentTiles = animatedTiles.cloneNode(true);
+            }
+        }
         if ((event.key === '+' || event.code === 'Equal') && zoom) {
             zoom.performZoomingByToolBar('zoomin');
         }
@@ -8338,6 +8428,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * 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.
+     * @returns {void}
      */
     Maps.prototype.mapsOnClick = function (e) {
         var _this = this;
@@ -8403,8 +8494,9 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     Maps.prototype.getClickLocation = function (targetId, pageX, pageY, targetElement, x, y) {
         var layerIndex = 0;
         var latLongValue;
-        if (targetId.indexOf('_LayerIndex_') !== -1 && !this.isTileMap && (parseInt(this.mouseDownEvent['x']) === parseInt(this.mouseClickEvent['x']))
-            && (parseInt(this.mouseDownEvent['y']) === parseInt(this.mouseClickEvent['y']))) {
+        if (targetId.indexOf('_LayerIndex_') !== -1 && !this.isTileMap &&
+            (parseInt(this.mouseDownEvent['x'], 10) === parseInt(this.mouseClickEvent['x'], 10)) &&
+            (parseInt(this.mouseDownEvent['y'], 10) === parseInt(this.mouseClickEvent['y'], 10))) {
             layerIndex = parseFloat(targetId.split('_LayerIndex_')[1].split('_')[0]);
             if (this.layers[layerIndex].geometryType === 'Normal') {
                 if (targetId.indexOf('_shapeIndex_') > -1) {
@@ -8441,12 +8533,21 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
                 latLongValue = this.getGeoLocation(layerIndex, x, y);
             }
         }
-        else if (this.isTileMap && (parseInt(this.mouseDownEvent['x']) === parseInt(this.mouseClickEvent['x']))
-            && (parseInt(this.mouseDownEvent['y']) === parseInt(this.mouseClickEvent['y']))) {
+        else if (this.isTileMap && (parseInt(this.mouseDownEvent['x'], 10) === parseInt(this.mouseClickEvent['x'], 10)) &&
+            (parseInt(this.mouseDownEvent['y'], 10) === parseInt(this.mouseClickEvent['y'], 10))) {
             latLongValue = this.getTileGeoLocation(x, y);
         }
         return latLongValue;
     };
+    Maps.prototype.removeTileMap = function () {
+        var animateElement = document.getElementById(this.element.id + '_animated_tiles');
+        if (!isNullOrUndefined(this.currentTiles) && animateElement.childElementCount !== this.currentTiles.childElementCount) {
+            for (var l = animateElement.childElementCount - 1; l >= this.currentTiles.childElementCount; l--) {
+                animateElement.removeChild(animateElement.children[l]);
+            }
+        }
+        this.currentTiles = null;
+    };
     /**
      * This method is used to perform operations when mouse click on maps.
      *
@@ -8478,6 +8579,9 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
             pageY = e.pageY;
             target = e.target;
         }
+        if (this.isTileMap) {
+            this.removeTileMap();
+        }
         if (this.isTouch) {
             if (targetEle.id.indexOf('_ToolBar') === -1) {
                 var latLongValue = this.getClickLocation(targetId, pageX, pageY, targetEle, pageX, pageY);
@@ -8510,6 +8614,10 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
         }
         var rect = this.element.getBoundingClientRect();
         var element = e.target;
+        var animatedTiles = document.getElementById(this.element.id + '_animated_tiles');
+        if (this.isTileMap && !isNullOrUndefined(animatedTiles)) {
+            this.currentTiles = animatedTiles.cloneNode(true);
+        }
         if (element.id.indexOf('_ToolBar') === -1) {
             var markerModule = this.markerModule;
             if (element.id.indexOf('shapeIndex') > -1 || element.id.indexOf('Tile') > -1) {
@@ -8542,6 +8650,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * This method is used to perform operations when performing the double click operation on maps.
      *
      * @param {PointerEvent} e - Specifies the pointer event.
+     * @returns {void}
      */
     Maps.prototype.mapsOnDoubleClick = function (e) {
         this.notify('dblclick', e);
@@ -8565,8 +8674,10 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
                 latitude = latLongValue['latitude'];
                 longitude = latLongValue['longitude'];
             }
-            var doubleClickArgs = { cancel: false, name: doubleClick, x: e.clientX, y: e.clientY,
-                target: targetId, latitude: latitude, longitude: longitude, isShapeSelected: null };
+            var doubleClickArgs = {
+                cancel: false, name: doubleClick, x: e.clientX, y: e.clientY,
+                target: targetId, latitude: latitude, longitude: longitude, isShapeSelected: null
+            };
             this.trigger('doubleClick', doubleClickArgs);
         }
     };
@@ -8658,28 +8769,30 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      */
     Maps.prototype.mapsOnResize = function (e) {
         var _this = this;
-        this.isResize = this.isReset = true;
-        var args = {
-            cancel: false,
-            name: resize,
-            previousSize: this.availableSize,
-            currentSize: calculateSize(this),
-            maps: this
-        };
-        this.trigger(resize, args);
-        if (!args.cancel) {
-            if (this.resizeTo) {
-                clearTimeout(this.resizeTo);
-            }
-            if (!isNullOrUndefined(this.element) && this.element.classList.contains('e-maps')) {
-                this.resizeTo = setTimeout(function () {
-                    _this.unWireEVents();
-                    _this.createSVG();
-                    _this.refreshing = true;
-                    _this.wireEVents();
-                    _this.render();
-                    _this.refreshing = false;
-                }, 500);
+        if (!this.isDestroyed) {
+            this.isResize = this.isReset = true;
+            var args = {
+                cancel: false,
+                name: resize,
+                previousSize: this.availableSize,
+                currentSize: calculateSize(this),
+                maps: this
+            };
+            this.trigger(resize, args);
+            if (!args.cancel) {
+                if (this.resizeTo) {
+                    clearTimeout(this.resizeTo);
+                }
+                if (!isNullOrUndefined(this.element) && this.element.classList.contains('e-maps')) {
+                    this.resizeTo = setTimeout(function () {
+                        _this.unWireEVents();
+                        _this.createSVG();
+                        _this.refreshing = true;
+                        _this.wireEVents();
+                        _this.render();
+                        _this.refreshing = false;
+                    }, 500);
+                }
             }
         }
         return false;
@@ -8694,69 +8807,79 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     Maps.prototype.zoomByPosition = function (centerPosition, zoomFactor) {
-        this.zoomNotApplied = false;
-        var isRefresh = this.zoomSettings.zoomFactor == zoomFactor;
-        if (!this.isTileMap && this.zoomModule) {
-            if (!isNullOrUndefined(centerPosition)) {
-                this.zoomSettings.zoomFactor = zoomFactor;
-                isRefresh = this.centerPosition.latitude === centerPosition.latitude && this.centerPosition.longitude === centerPosition.longitude ? true : isRefresh;
+        if (!this.isDestroyed) {
+            this.zoomNotApplied = false;
+            var isRefresh = this.zoomSettings.zoomFactor === zoomFactor;
+            if (!this.isTileMap && this.zoomModule) {
+                if (!isNullOrUndefined(centerPosition)) {
+                    this.zoomSettings.zoomFactor = zoomFactor;
+                    isRefresh = this.centerPosition.latitude === centerPosition.latitude &&
+                        this.centerPosition.longitude === centerPosition.longitude ? true : isRefresh;
+                    this.centerPosition = centerPosition;
+                    this.isZoomByPosition = true;
+                    this.mapScaleValue = null;
+                }
+                else {
+                    this.zoomSettings.zoomFactor = zoomFactor;
+                    this.isZoomByPosition = true;
+                    this.mapScaleValue = null;
+                }
+            }
+            else if (this.zoomModule) {
+                this.tileZoomLevel = this.zoomSettings.zoomFactor = zoomFactor;
+                isRefresh = this.centerPosition.latitude === centerPosition.latitude &&
+                    this.centerPosition.longitude === centerPosition.longitude ? true : isRefresh;
                 this.centerPosition = centerPosition;
                 this.isZoomByPosition = true;
-                this.mapScaleValue = null;
             }
-            else {
-                this.zoomSettings.zoomFactor = zoomFactor;
-                this.isZoomByPosition = true;
-                this.mapScaleValue = null;
+            if (isRefresh) {
+                this.refresh();
             }
         }
-        else if (this.zoomModule) {
-            this.tileZoomLevel = this.zoomSettings.zoomFactor = zoomFactor;
-            isRefresh = this.centerPosition.latitude === centerPosition.latitude && this.centerPosition.longitude === centerPosition.longitude ? true : isRefresh;
-            this.centerPosition = centerPosition;
-            this.isZoomByPosition = true;
-        }
-        if (isRefresh) {
-            this.refresh();
-        }
     };
     /**
      * This method is used to perform panning by specifying the direction.
      *
      * @param {PanDirection} direction - Specifies the direction in which the panning is performed.
      * @param {PointerEvent | TouchEvent} mouseLocation - Specifies the location of the mouse pointer in maps.
+     * @returns {void}
      */
     Maps.prototype.panByDirection = function (direction, mouseLocation) {
-        var xDiff = 0;
-        var yDiff = 0;
-        switch (direction) {
-            case 'Left':
-                xDiff = -(this.mapAreaRect.width / 7);
-                break;
-            case 'Right':
-                xDiff = (this.mapAreaRect.width / 7);
-                break;
-            case 'Top':
-                yDiff = -(this.mapAreaRect.height / 7);
-                break;
-            case 'Bottom':
-                yDiff = (this.mapAreaRect.height / 7);
-                break;
-        }
-        if (this.zoomModule) {
-            this.zoomModule.panning(direction, xDiff, yDiff, mouseLocation);
+        if (!this.isDestroyed) {
+            var xDiff = 0;
+            var yDiff = 0;
+            switch (direction) {
+                case 'Left':
+                    xDiff = -(this.mapAreaRect.width / 7);
+                    break;
+                case 'Right':
+                    xDiff = (this.mapAreaRect.width / 7);
+                    break;
+                case 'Top':
+                    yDiff = -(this.mapAreaRect.height / 7);
+                    break;
+                case 'Bottom':
+                    yDiff = (this.mapAreaRect.height / 7);
+                    break;
+            }
+            if (this.zoomModule) {
+                this.zoomModule.panning(direction, xDiff, yDiff, mouseLocation);
+            }
         }
     };
     /**
      * This method is used to add the layers dynamically to the maps.
      *
      * @param {Object} layer - Specifies the layer for the maps.
+     * @returns {void}
      */
     Maps.prototype.addLayer = function (layer) {
-        var mapsLayer = this.layers;
-        mapsLayer.push(layer);
-        this.isAddLayer = true;
-        this.layers = mapsLayer;
+        if (!this.isDestroyed) {
+            var mapsLayer = this.layers;
+            mapsLayer.push(layer);
+            this.isAddLayer = true;
+            this.layers = mapsLayer;
+        }
     };
     /**
      * This method is used to remove a layer from map.
@@ -8765,9 +8888,11 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     Maps.prototype.removeLayer = function (index) {
-        var mapsLayer = this.layers;
-        mapsLayer.splice(index, 1);
-        this.layers = mapsLayer;
+        if (!this.isDestroyed) {
+            var mapsLayer = this.layers;
+            mapsLayer.splice(index, 1);
+            this.layers = mapsLayer;
+        }
     };
     /**
      * This method is used to add markers dynamically in the maps.
@@ -8779,15 +8904,17 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     Maps.prototype.addMarker = function (layerIndex, markerCollection) {
-        var layerEle = document.getElementById(this.element.id + '_LayerIndex_' + layerIndex);
-        if (markerCollection.length > 0 && layerEle) {
-            for (var _i = 0, markerCollection_1 = markerCollection; _i < markerCollection_1.length; _i++) {
-                var newMarker = markerCollection_1[_i];
-                this.layersCollection[layerIndex].markerSettings.push(new MarkerSettings(this, 'markerSettings', newMarker));
+        if (!this.isDestroyed) {
+            var layerEle = document.getElementById(this.element.id + '_LayerIndex_' + layerIndex);
+            if (markerCollection.length > 0 && layerEle) {
+                for (var _i = 0, markerCollection_1 = markerCollection; _i < markerCollection_1.length; _i++) {
+                    var newMarker = markerCollection_1[_i];
+                    this.layersCollection[layerIndex].markerSettings.push(new MarkerSettings(this, 'markerSettings', newMarker));
+                }
+                var markerModule = new Marker(this);
+                markerModule.markerRender(this, layerEle, layerIndex, this.mapLayerPanel['currentFactor'], 'AddMarker');
+                this.arrangeTemplate();
             }
-            var markerModule = new Marker(this);
-            markerModule.markerRender(this, layerEle, layerIndex, this.mapLayerPanel['currentFactor'], 'AddMarker');
-            this.arrangeTemplate();
         }
     };
     /**
@@ -8800,93 +8927,96 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     Maps.prototype.shapeSelection = function (layerIndex, propertyName, name, enable) {
-        var targetEle;
-        var subLayerIndex;
-        var popertyNameArray = Array.isArray(propertyName) ? propertyName : Array(propertyName);
-        if (isNullOrUndefined(enable)) {
-            enable = true;
-        }
-        var selectionsettings = this.layers[layerIndex].selectionSettings;
-        if (!selectionsettings.enableMultiSelect && this.legendSelection && enable) {
-            this.removeShapeSelection();
-        }
-        if (this.layers[layerIndex].type === 'SubLayer') {
-            for (var i = 0; i < this.layersCollection.length; i++) {
-                if ((this.layersCollection[i].shapeData === this.layers[layerIndex].shapeData)) {
-                    subLayerIndex = i;
-                    break;
+        if (!this.isDestroyed) {
+            var targetEle = void 0;
+            var subLayerIndex = void 0;
+            var popertyNameArray = Array.isArray(propertyName) ? propertyName : Array(propertyName);
+            if (isNullOrUndefined(enable)) {
+                enable = true;
+            }
+            var selectionsettings = this.layers[layerIndex].selectionSettings;
+            if (!selectionsettings.enableMultiSelect && this.legendSelection && enable) {
+                this.removeShapeSelection();
+            }
+            if (this.layers[layerIndex].type === 'SubLayer') {
+                for (var i = 0; i < this.layersCollection.length; i++) {
+                    if ((this.layersCollection[i].shapeData === this.layers[layerIndex].shapeData)) {
+                        subLayerIndex = i;
+                        break;
+                    }
                 }
             }
-        }
-        if (selectionsettings.enable) {
-            var targetId = void 0;
-            var dataIndex = void 0;
-            var shapeIndex = void 0;
-            var indexValue = void 0;
-            var shapeDataValue = void 0;
-            var data = void 0;
-            var shapeData = this.layers[layerIndex].shapeData['features'];
-            for (var i = 0; i < shapeData.length; i++) {
-                for (var j = 0; j < popertyNameArray.length; j++) {
-                    var propertyName_1 = !isNullOrUndefined(shapeData[i]['properties'][popertyNameArray[j]])
-                        && isNaN(shapeData[i]['properties'][popertyNameArray[j]]) ?
-                        shapeData[i]['properties'][popertyNameArray[j]].toLowerCase() : shapeData[i]['properties'][popertyNameArray[j]];
-                    var shapeName = !isNullOrUndefined(name) && typeof name === 'string' ? name.toLowerCase() : name;
-                    var k = void 0;
-                    if (propertyName_1 === shapeName) {
-                        if (!isNullOrUndefined(this.layers[layerIndex].shapeSettings.colorValuePath)) {
-                            k = checkShapeDataFields(this.layers[layerIndex].dataSource, shapeData[i]['properties'], this.layers[layerIndex].shapeDataPath, this.layers[layerIndex].shapePropertyPath, this.layers[layerIndex]);
-                        }
-                        var baseLayer = this.layers[layerIndex];
-                        if (this.baseLayerIndex >= 0 && baseLayer.isBaseLayer) {
-                            indexValue = 0;
-                        }
-                        else if (this.layers[layerIndex].type === 'SubLayer') {
-                            indexValue = subLayerIndex;
-                        }
-                        targetId = this.element.id + '_' + 'LayerIndex_' + indexValue + '_shapeIndex_' + i + '_dataIndex_' + k;
-                        targetEle = getElement(targetId);
-                        if (isNullOrUndefined(k) && isNullOrUndefined(targetEle)) {
-                            targetId = this.element.id + '_' + 'LayerIndex_' + layerIndex + '_shapeIndex_' + i + '_dataIndex_null';
+            if (selectionsettings.enable) {
+                var targetId = void 0;
+                var dataIndex = void 0;
+                var shapeIndex = void 0;
+                var indexValue = void 0;
+                var shapeDataValue = void 0;
+                var data = void 0;
+                var shapeData = this.layers[layerIndex].shapeData['features'];
+                for (var i = 0; i < shapeData.length; i++) {
+                    for (var j = 0; j < popertyNameArray.length; j++) {
+                        var propertyName_1 = !isNullOrUndefined(shapeData[i]['properties'][popertyNameArray[j]])
+                            && isNaN(shapeData[i]['properties'][popertyNameArray[j]]) ?
+                            shapeData[i]['properties'][popertyNameArray[j]].toLowerCase() : shapeData[i]['properties'][popertyNameArray[j]];
+                        var shapeName = !isNullOrUndefined(name) && typeof name === 'string' ? name.toLowerCase() : name;
+                        var k = void 0;
+                        if (propertyName_1 === shapeName) {
+                            if (!isNullOrUndefined(this.layers[layerIndex].shapeSettings.colorValuePath)) {
+                                k = checkShapeDataFields(this.layers[layerIndex].dataSource, shapeData[i]['properties'], this.layers[layerIndex].shapeDataPath, this.layers[layerIndex].shapePropertyPath, this.layers[layerIndex]);
+                            }
+                            var baseLayer = this.layers[layerIndex];
+                            if (this.baseLayerIndex >= 0 && baseLayer.isBaseLayer) {
+                                indexValue = 0;
+                            }
+                            else if (this.layers[layerIndex].type === 'SubLayer') {
+                                indexValue = subLayerIndex;
+                            }
+                            targetId = this.element.id + '_' + 'LayerIndex_' + indexValue + '_shapeIndex_' + i + '_dataIndex_' + k;
                             targetEle = getElement(targetId);
-                        }
-                        shapeIndex = parseInt(targetEle.id.split('_shapeIndex_')[1].split('_')[0], 10);
-                        shapeDataValue = this.layers[layerIndex].shapeData['features']['length'] > shapeIndex ?
-                            this.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] : null;
-                        dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);
-                        data = isNullOrUndefined(dataIndex) ? null : this.layers[layerIndex].dataSource[dataIndex];
-                        if (enable) {
-                            triggerItemSelectionEvent(selectionsettings, this, targetEle, shapeDataValue, data);
-                            this.shapeSelectionClass = getElement('ShapeselectionMap');
-                            if (this.legendSettings.visible && targetEle.id.indexOf('_MarkerIndex_') === -1) {
-                                this.legendModule.shapeHighLightAndSelection(targetEle, data, selectionsettings, 'selection', layerIndex);
+                            if (isNullOrUndefined(k) && isNullOrUndefined(targetEle)) {
+                                targetId = this.element.id + '_' + 'LayerIndex_' + layerIndex + '_shapeIndex_' + i + '_dataIndex_null';
+                                targetEle = getElement(targetId);
                             }
-                            var shapeToggled = this.legendSettings.visible ? this.legendModule.shapeToggled : true;
-                            if (shapeToggled) {
-                                targetEle.setAttribute('class', 'ShapeselectionMapStyle');
-                                if (this.selectedElementId.indexOf(targetEle.getAttribute('id')) === -1) {
-                                    this.selectedElementId.push(targetEle.getAttribute('id'));
+                            shapeIndex = parseInt(targetEle.id.split('_shapeIndex_')[1].split('_')[0], 10);
+                            shapeDataValue = this.layers[layerIndex].shapeData['features']['length'] > shapeIndex ?
+                                this.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] : null;
+                            dataIndex = parseInt(targetEle.id.split('_dataIndex_')[1].split('_')[0], 10);
+                            data = isNullOrUndefined(dataIndex) ? null : this.layers[layerIndex].dataSource[dataIndex];
+                            if (enable) {
+                                triggerItemSelectionEvent(selectionsettings, this, targetEle, shapeDataValue, data);
+                                this.shapeSelectionClass = getElement('ShapeselectionMap');
+                                if (this.legendSettings.visible && targetEle.id.indexOf('_MarkerIndex_') === -1) {
+                                    this.legendModule.shapeHighLightAndSelection(targetEle, data, selectionsettings, 'selection', layerIndex);
                                 }
-                                if (!selectionsettings.enableMultiSelect) {
-                                    return;
+                                var shapeToggled = this.legendSettings.visible ? this.legendModule.shapeToggled : true;
+                                if (shapeToggled) {
+                                    targetEle.setAttribute('class', 'ShapeselectionMapStyle');
+                                    if (this.selectedElementId.indexOf(targetEle.getAttribute('id')) === -1) {
+                                        this.selectedElementId.push(targetEle.getAttribute('id'));
+                                    }
+                                    if (!selectionsettings.enableMultiSelect) {
+                                        return;
+                                    }
                                 }
                             }
-                        }
-                        else {
-                            this.legendSelection = (!selectionsettings.enableMultiSelect && !this.legendSelection) ?
-                                true : this.legendSelection;
-                            if (this.legendSettings.visible && targetEle.id.indexOf('_MarkerIndex_') === -1 &&
-                                targetEle.getAttribute('class') === 'ShapeselectionMapStyle') {
-                                this.legendModule.shapeHighLightAndSelection(targetEle, data, selectionsettings, 'selection', layerIndex);
-                            }
-                            var shapeToggled = this.legendSettings.visible ? this.legendModule.shapeToggled : true;
-                            if (shapeToggled) {
-                                removeClass(targetEle);
-                                var selectedElementIdIndex = this.selectedElementId.indexOf(targetEle.getAttribute('id'));
-                                if (selectedElementIdIndex !== -1) {
-                                    this.selectedElementId.splice(selectedElementIdIndex, 1);
-                                    if (!selectionsettings.enableMultiSelect && this.legendSelection && this.selectedElementId.length > 0) {
-                                        this.removeShapeSelection();
+                            else {
+                                this.legendSelection = (!selectionsettings.enableMultiSelect && !this.legendSelection) ?
+                                    true : this.legendSelection;
+                                if (this.legendSettings.visible && targetEle.id.indexOf('_MarkerIndex_') === -1 &&
+                                    targetEle.getAttribute('class') === 'ShapeselectionMapStyle') {
+                                    this.legendModule.shapeHighLightAndSelection(targetEle, data, selectionsettings, 'selection', layerIndex);
+                                }
+                                var shapeToggled = this.legendSettings.visible ? this.legendModule.shapeToggled : true;
+                                if (shapeToggled) {
+                                    removeClass(targetEle);
+                                    var selectedElementIdIndex = this.selectedElementId.indexOf(targetEle.getAttribute('id'));
+                                    if (selectedElementIdIndex !== -1) {
+                                        this.selectedElementId.splice(selectedElementIdIndex, 1);
+                                        if (!selectionsettings.enableMultiSelect && this.legendSelection
+                                            && this.selectedElementId.length > 0) {
+                                            this.removeShapeSelection();
+                                        }
                                     }
                                 }
                             }
@@ -8907,53 +9037,55 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      */
     Maps.prototype.zoomToCoordinates = function (minLatitude, minLongitude, maxLatitude, maxLongitude) {
         var _a, _b;
-        var centerLatitude;
-        var centerLongtitude;
-        var isTwoCoordinates = false;
-        this.centerPosition = {
-            latitude: null,
-            longitude: null
-        };
-        this.isZoomByPosition = false;
-        if (isNullOrUndefined(maxLatitude) && isNullOrUndefined(maxLongitude)
-            || isNullOrUndefined(minLatitude) && isNullOrUndefined(minLongitude)) {
-            minLatitude = isNullOrUndefined(minLatitude) ? 0 : minLatitude;
-            minLongitude = isNullOrUndefined(minLatitude) ? 0 : minLongitude;
-            maxLatitude = isNullOrUndefined(maxLatitude) ? minLatitude : maxLatitude;
-            maxLongitude = isNullOrUndefined(maxLongitude) ? minLongitude : maxLongitude;
-            isTwoCoordinates = true;
-        }
-        if (minLatitude > maxLatitude) {
-            _a = [maxLatitude, minLatitude], minLatitude = _a[0], maxLatitude = _a[1];
-        }
-        if (minLongitude > maxLongitude) {
-            _b = [maxLongitude, minLongitude], minLongitude = _b[0], maxLongitude = _b[1];
-        }
-        if (!isTwoCoordinates) {
-            centerLatitude = (minLatitude + maxLatitude) / 2;
-            centerLongtitude = (minLongitude + maxLongitude) / 2;
+        if (!this.isDestroyed) {
+            var centerLatitude = void 0;
+            var centerLongtitude = void 0;
+            var isTwoCoordinates = false;
+            this.centerPosition = {
+                latitude: null,
+                longitude: null
+            };
+            this.isZoomByPosition = false;
+            if (isNullOrUndefined(maxLatitude) && isNullOrUndefined(maxLongitude)
+                || isNullOrUndefined(minLatitude) && isNullOrUndefined(minLongitude)) {
+                minLatitude = isNullOrUndefined(minLatitude) ? 0 : minLatitude;
+                minLongitude = isNullOrUndefined(minLatitude) ? 0 : minLongitude;
+                maxLatitude = isNullOrUndefined(maxLatitude) ? minLatitude : maxLatitude;
+                maxLongitude = isNullOrUndefined(maxLongitude) ? minLongitude : maxLongitude;
+                isTwoCoordinates = true;
+            }
+            if (minLatitude > maxLatitude) {
+                _a = [maxLatitude, minLatitude], minLatitude = _a[0], maxLatitude = _a[1];
+            }
+            if (minLongitude > maxLongitude) {
+                _b = [maxLongitude, minLongitude], minLongitude = _b[0], maxLongitude = _b[1];
+            }
+            if (!isTwoCoordinates) {
+                centerLatitude = (minLatitude + maxLatitude) / 2;
+                centerLongtitude = (minLongitude + maxLongitude) / 2;
+            }
+            else {
+                centerLatitude = (minLatitude + maxLatitude);
+                centerLongtitude = (minLongitude + maxLongitude);
+            }
+            this.centerLatOfGivenLocation = centerLatitude;
+            this.centerLongOfGivenLocation = centerLongtitude;
+            this.minLatOfGivenLocation = minLatitude;
+            this.minLongOfGivenLocation = minLongitude;
+            this.maxLatOfGivenLocation = maxLatitude;
+            this.maxLongOfGivenLocation = maxLongitude;
+            this.zoomNotApplied = true;
+            this.scaleOfGivenLocation = calculateZoomLevel(minLatitude, maxLatitude, minLongitude, maxLongitude, this.mapAreaRect.width, this.mapAreaRect.height, this);
+            var zoomArgs = {
+                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 } :
+                    { previous: this.tileZoomLevel, current: this.scaleOfGivenLocation }
+            };
+            this.trigger('zoom', zoomArgs);
+            this.refresh();
         }
-        else {
-            centerLatitude = (minLatitude + maxLatitude);
-            centerLongtitude = (minLongitude + maxLongitude);
-        }
-        this.centerLatOfGivenLocation = centerLatitude;
-        this.centerLongOfGivenLocation = centerLongtitude;
-        this.minLatOfGivenLocation = minLatitude;
-        this.minLongOfGivenLocation = minLongitude;
-        this.maxLatOfGivenLocation = maxLatitude;
-        this.maxLongOfGivenLocation = maxLongitude;
-        this.zoomNotApplied = true;
-        this.scaleOfGivenLocation = calculateZoomLevel(minLatitude, maxLatitude, minLongitude, maxLongitude, this.mapAreaRect.width, this.mapAreaRect.height, this);
-        var zoomArgs = {
-            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 } :
-                { previous: this.tileZoomLevel, current: this.scaleOfGivenLocation }
-        };
-        this.trigger('zoom', zoomArgs);
-        this.refresh();
     };
     /**
      * This method is used to remove multiple selected shapes in the maps.
@@ -9004,6 +9136,8 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     /**
      * This method disposes the maps component.
+     *
+     * @returns {void}
      */
     Maps.prototype.destroy = function () {
         this.unWireEVents();
@@ -9060,93 +9194,96 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @private
      */
     Maps.prototype.onPropertyChanged = function (newProp, oldProp) {
-        var render = false;
-        var isMarker = false;
-        var isLayer = false;
-        var isStaticMapType = false;
-        var layerEle;
-        if (newProp['layers']) {
-            var newLayerLength = Object.keys(newProp['layers']).length;
-            layerEle = document.getElementById(this.element.id + '_LayerIndex_' + (newLayerLength - 1));
-        }
-        for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {
-            var prop = _a[_i];
-            switch (prop) {
-                case 'background':
-                    this.renderBorder();
-                    break;
-                case 'height':
-                case 'width':
-                case 'layers':
-                case 'projectionType':
-                case 'centerPosition':
-                case 'legendSettings':
-                case 'baseLayerIndex':
-                    if (prop === 'layers') {
-                        isLayer = true;
-                        var layerPropLength = Object.keys(newProp.layers).length;
-                        for (var x = 0; x < layerPropLength; x++) {
-                            if (!isNullOrUndefined(newProp.layers[x])) {
-                                var collection = Object.keys(newProp.layers[x]);
-                                for (var _b = 0, collection_1 = collection; _b < collection_1.length; _b++) {
-                                    var collectionProp = collection_1[_b];
-                                    if ((collectionProp === 'layerType' && newProp.layers[x].layerType !== 'Geometry') || (isNullOrUndefined(this.layers[x].shapeData)
-                                        && !isNullOrUndefined(this.layers[x].urlTemplate) && this.layers[x].urlTemplate !== '')) {
-                                        this.isReset = true;
-                                    }
-                                    else if (collectionProp === 'markerSettings') {
-                                        isMarker = true;
-                                    }
-                                    else if (collectionProp === 'staticMapType') {
-                                        isStaticMapType = true;
+        if (!this.isDestroyed) {
+            var render = false;
+            var isMarker = false;
+            var isLayer = false;
+            var isStaticMapType = false;
+            var layerEle = void 0;
+            if (newProp['layers']) {
+                var newLayerLength = Object.keys(newProp['layers']).length;
+                layerEle = document.getElementById(this.element.id + '_LayerIndex_' + (newLayerLength - 1));
+            }
+            for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {
+                var prop = _a[_i];
+                switch (prop) {
+                    case 'background':
+                        this.renderBorder();
+                        break;
+                    case 'height':
+                    case 'width':
+                    case 'layers':
+                    case 'projectionType':
+                    case 'centerPosition':
+                    case 'legendSettings':
+                    case 'baseLayerIndex':
+                        if (prop === 'layers') {
+                            isLayer = true;
+                            var layerPropLength = Object.keys(newProp.layers).length;
+                            for (var x = 0; x < layerPropLength; x++) {
+                                if (!isNullOrUndefined(newProp.layers[x])) {
+                                    var collection = Object.keys(newProp.layers[x]);
+                                    for (var _b = 0, collection_1 = collection; _b < collection_1.length; _b++) {
+                                        var collectionProp = collection_1[_b];
+                                        if ((collectionProp === 'layerType' && newProp.layers[x].layerType !== 'Geometry') ||
+                                            (isNullOrUndefined(this.layers[x].shapeData)
+                                                && !isNullOrUndefined(this.layers[x].urlTemplate) && this.layers[x].urlTemplate !== '')) {
+                                            this.isReset = true;
+                                        }
+                                        else if (collectionProp === 'markerSettings') {
+                                            isMarker = true;
+                                        }
+                                        else if (collectionProp === 'staticMapType') {
+                                            isStaticMapType = true;
+                                        }
                                     }
                                 }
                             }
                         }
-                    }
-                    render = true;
-                    break;
-                case 'zoomSettings':
-                    if (!isNullOrUndefined(oldProp.zoomSettings)) {
-                        if (newProp.zoomSettings.zoomFactor !== oldProp.zoomSettings.zoomFactor && !isLayer) {
-                            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;
+                        render = true;
+                        break;
+                    case 'zoomSettings':
+                        if (!isNullOrUndefined(oldProp.zoomSettings)) {
+                            if (newProp.zoomSettings.zoomFactor !== oldProp.zoomSettings.zoomFactor && !isLayer) {
+                                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':
-                case 'currencyCode':
-                    _super.prototype.refresh.call(this);
-                    break;
+                        break;
+                    case 'locale':
+                    case 'currencyCode':
+                        _super.prototype.refresh.call(this);
+                        break;
+                }
             }
-        }
-        if (render) {
-            if (newProp.layers && isMarker) {
-                removeElement(this.element.id + '_Markers_Group');
-                if (this.isTileMap) {
-                    this.mapLayerPanel.renderTileLayer(this.mapLayerPanel, this.layers['currentFactor'], (this.layers.length - 1));
+            if (render) {
+                if (newProp.layers && isMarker) {
+                    removeElement(this.element.id + '_Markers_Group');
+                    if (this.isTileMap) {
+                        this.mapLayerPanel.renderTileLayer(this.mapLayerPanel, this.layers['currentFactor'], (this.layers.length - 1));
+                    }
+                    else {
+                        this.render();
+                    }
+                }
+                else if (newProp.layers && isStaticMapType) {
+                    this.mapLayerPanel.renderGoogleMap(this.layers[this.layers.length - 1].key, this.staticMapZoom);
                 }
                 else {
-                    this.render();
+                    this.createSVG();
+                    this.renderElements();
                 }
             }
-            else if (newProp.layers && isStaticMapType) {
-                this.mapLayerPanel.renderGoogleMap(this.layers[this.layers.length - 1].key, this.staticMapZoom);
-            }
-            else {
-                this.createSVG();
-                this.renderElements();
-            }
         }
     };
     /**
@@ -9159,7 +9296,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
         var modules = [];
         var isVisible = this.findVisibleLayers(this.layers);
         var annotationEnable = false;
-        this.annotations.map(function (annotation, index) {
+        this.annotations.map(function (annotation) {
             annotationEnable = annotation.content != null;
         });
         if (this.isBubbleVisible()) {
@@ -9244,10 +9381,12 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     /**
      * To find marker visibility
+     *
+     * @returns {boolean} - Returns whether the markers are visible or not.
      */
     Maps.prototype.isMarkersVisible = function () {
         var isVisible = false;
-        Array.prototype.forEach.call(this.layers, function (layer, layerIndex) {
+        Array.prototype.forEach.call(this.layers, function (layer) {
             for (var i = 0; i < layer.markerSettings.length; i++) {
                 if (layer.markerSettings[i].visible) {
                     isVisible = true;
@@ -9259,6 +9398,8 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     /**
      * To find DataLabel visibility
+     *
+     * @returns {boolean} - Returns whether the data labels are visible or not.
      */
     Maps.prototype.isDataLabelVisible = function () {
         var isVisible = false;
@@ -9272,10 +9413,12 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     /**
      * To find navigation line visibility
+     *
+     * @returns {boolean} - Returns whether the navigation lines are visible or not.
      */
     Maps.prototype.isNavigationVisible = function () {
         var isVisible = false;
-        Array.prototype.forEach.call(this.layers, function (layer, layerIndex) {
+        Array.prototype.forEach.call(this.layers, function (layer) {
             for (var i = 0; i < layer.navigationLineSettings.length; i++) {
                 if (layer.navigationLineSettings[i].visible) {
                     isVisible = true;
@@ -9287,6 +9430,8 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
     };
     /**
      * To find space between the secondary element and svg element.
+     *
+     * @returns {Point} - Returns the left and top value of the secondary element of Maps.
      * @private
      */
     Maps.prototype.getExtraPosition = function () {
@@ -9344,7 +9489,7 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     Maps.prototype.print = function (id) {
-        if ((this.allowPrint) && (this.printModule)) {
+        if ((this.allowPrint) && (this.printModule) && !this.isDestroyed) {
             this.printModule.print(this, id);
         }
     };
@@ -9359,18 +9504,20 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      */
     Maps.prototype.export = function (type, fileName, orientation, allowDownload) {
         var _this = this;
-        if (isNullOrUndefined(allowDownload)) {
-            allowDownload = true;
-        }
-        if ((type !== 'PDF') && (this.allowImageExport) && (this.imageExportModule)) {
-            return new Promise(function (resolve, reject) {
-                resolve(_this.imageExportModule.export(_this, type, fileName, allowDownload));
-            });
-        }
-        else if ((this.allowPdfExport) && (this.pdfExportModule)) {
-            return new Promise(function (resolve, reject) {
-                resolve(_this.pdfExportModule.export(_this, type, fileName, allowDownload, orientation));
-            });
+        if (!this.isDestroyed) {
+            if (isNullOrUndefined(allowDownload)) {
+                allowDownload = true;
+            }
+            if ((type !== 'PDF') && (this.allowImageExport) && (this.imageExportModule)) {
+                return new Promise(function (resolve, reject) {
+                    resolve(_this.imageExportModule.export(_this, type, fileName, allowDownload));
+                });
+            }
+            else if ((this.allowPdfExport) && (this.pdfExportModule)) {
+                return new Promise(function (resolve, reject) {
+                    resolve(_this.pdfExportModule.export(_this, type, fileName, allowDownload, orientation));
+                });
+            }
         }
         return null;
     };
@@ -9381,19 +9528,22 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {Promise<string>} - Returns the processed Bing URL as Promise.
      */
     Maps.prototype.getBingUrlTemplate = function (url) {
-        var promise = new Promise(function (resolve, reject) {
-            var ajax = new Ajax({
-                url: url
+        var promise;
+        if (!this.isDestroyed) {
+            promise = new Promise(function (resolve, reject) {
+                var ajax = new Ajax({
+                    url: url
+                });
+                ajax.onSuccess = function (json) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    var jsonObject = JSON.parse(json);
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    var resource = jsonObject['resourceSets'][0]['resources'][0];
+                    resolve(resource['imageUrl']);
+                };
+                ajax.send();
             });
-            ajax.onSuccess = function (json) {
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                var jsonObject = JSON.parse(json);
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                var resource = jsonObject['resourceSets'][0]['resources'][0];
-                resolve(resource['imageUrl']);
-            };
-            ajax.send();
-        });
+        }
         return promise;
     };
     /**
@@ -9474,21 +9624,25 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {GeoPosition}- Returns the geo position
      */
     Maps.prototype.getGeoLocation = function (layerIndex, x, y) {
-        var container = document.getElementById(this.element.id);
-        var pageX = x - container.offsetLeft;
-        var pageY = y - container.offsetTop;
-        var currentLayer = this.layersCollection[layerIndex];
-        var translate = getTranslate(this, currentLayer, false);
-        var translatePoint = translate['location'];
-        var translatePointX = translatePoint.x * this.scale;
-        var translatePointY = translatePoint.y * this.scale;
-        var mapSize = (Math.min(this.mapAreaRect.height, this.mapAreaRect.width)
-            * this.mapLayerPanel['currentFactor']) * this.scale;
-        var xx = (this.clip(pageX - translatePointX, 0, mapSize - 1) / mapSize) - 0.5;
-        var yy = 0.5 - (this.clip(pageY - translatePointY, 0, mapSize - 1) / mapSize);
-        var lat = 90 - 360 * Math.atan(Math.exp(-yy * 2 * Math.PI)) / Math.PI;
-        var long = 360 * xx;
-        return { latitude: lat, longitude: long };
+        var latitude = 0;
+        var longitude = 0;
+        if (!this.isDestroyed) {
+            var container = document.getElementById(this.element.id);
+            var pageX = x - container.offsetLeft;
+            var pageY = y - container.offsetTop;
+            var currentLayer = this.layersCollection[layerIndex];
+            var translate = getTranslate(this, currentLayer, false);
+            var translatePoint = translate['location'];
+            var translatePointX = translatePoint.x * this.scale;
+            var translatePointY = translatePoint.y * this.scale;
+            var mapSize = (Math.min(this.mapAreaRect.height, this.mapAreaRect.width)
+                * this.mapLayerPanel['currentFactor']) * this.scale;
+            var xx = (this.clip(pageX - translatePointX, 0, mapSize - 1) / mapSize) - 0.5;
+            var yy = 0.5 - (this.clip(pageY - translatePointY, 0, mapSize - 1) / mapSize);
+            latitude = 90 - 360 * Math.atan(Math.exp(-yy * 2 * Math.PI)) / Math.PI;
+            longitude = 360 * xx;
+        }
+        return { latitude: latitude, longitude: longitude };
     };
     Maps.prototype.clip = function (value, minVal, maxVal) {
         return Math.min(Math.max(value, minVal), maxVal);
@@ -9501,10 +9655,16 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {GeoPosition} - Returns the position
      */
     Maps.prototype.getTileGeoLocation = function (x, y) {
-        var container = document.getElementById(this.element.id);
-        var ele = document.getElementById(this.element.id + '_tile_parent');
-        var latLong = this.pointToLatLong(x + this.mapAreaRect.x - (ele.offsetLeft - container.offsetLeft), y + this.mapAreaRect.y - (ele.offsetTop - container.offsetTop));
-        return { latitude: latLong['latitude'], longitude: latLong['longitude'] };
+        var latitude = 0;
+        var longitude = 0;
+        if (!this.isDestroyed) {
+            var container = document.getElementById(this.element.id);
+            var ele = document.getElementById(this.element.id + '_tile_parent');
+            var latLong = this.pointToLatLong(x + this.mapAreaRect.x - (ele.offsetLeft - container.offsetLeft), y + this.mapAreaRect.y - (ele.offsetTop - container.offsetTop));
+            latitude = latLong['latitude'];
+            longitude = latLong['longitude'];
+        }
+        return { latitude: latitude, longitude: longitude };
     };
     /**
      * This method is used to convert the point to latitude and longitude in maps.
@@ -9514,14 +9674,18 @@ var Maps = /** @__PURE__ @class */ (function (_super) {
      * @returns {Object} - Returns the object.
      */
     Maps.prototype.pointToLatLong = function (pageX, pageY) {
-        var padding = this.layers[this.layers.length - 1].layerType === 'GoogleStaticMap' ? 0 : 10;
-        pageY = (this.zoomSettings.enable) ? pageY + padding : pageY;
-        var mapSize = 256 * Math.pow(2, this.tileZoomLevel);
-        var x1 = (this.clip(pageX - (this.translatePoint.x * this.scale), 0, mapSize - 1) / mapSize) - 0.5;
-        var y1 = 0.5 - (this.clip(pageY - (this.translatePoint.y * this.scale), 0, mapSize - 1) / mapSize);
-        var lat = 90 - 360 * Math.atan(Math.exp(-y1 * 2 * Math.PI)) / Math.PI;
-        var long = 360 * x1;
-        return { latitude: lat, longitude: long };
+        var latitude = 0;
+        var longitude = 0;
+        if (!this.isDestroyed) {
+            var padding = this.layers[this.layers.length - 1].layerType === 'GoogleStaticMap' ? 0 : 10;
+            pageY = (this.zoomSettings.enable) ? pageY + padding : pageY;
+            var mapSize = 256 * Math.pow(2, this.tileZoomLevel);
+            var x1 = (this.clip(pageX - (this.translatePoint.x * this.scale), 0, mapSize - 1) / mapSize) - 0.5;
+            var y1 = 0.5 - (this.clip(pageY - (this.translatePoint.y * this.scale), 0, mapSize - 1) / mapSize);
+            latitude = 90 - 360 * Math.atan(Math.exp(-y1 * 2 * Math.PI)) / Math.PI;
+            longitude = 360 * x1;
+        }
+        return { latitude: latitude, longitude: longitude };
     };
     __decorate([
         Property(null)
@@ -9717,7 +9881,8 @@ var Bubble = /** @__PURE__ @class */ (function () {
         var layerData = layer.layerData;
         var colorValuePath = bubbleSettings.colorValuePath;
         var equalValue = (!isNullOrUndefined(colorValuePath)) ? ((colorValuePath.indexOf('.') > -1) ?
-            (getValueFromObject(shapeData, bubbleSettings.colorValuePath)) : shapeData[colorValuePath]) : shapeData[colorValuePath];
+            (getValueFromObject(shapeData, bubbleSettings.colorValuePath)) : shapeData[colorValuePath]) :
+            shapeData[colorValuePath];
         var colorValue = (!isNullOrUndefined(colorValuePath)) ? ((colorValuePath.indexOf('.') > -1) ?
             Number(getValueFromObject(shapeData, bubbleSettings.colorValuePath)) : Number(shapeData[colorValuePath])) :
             Number(shapeData[colorValuePath]);
@@ -9871,16 +10036,17 @@ var Bubble = /** @__PURE__ @class */ (function () {
         }
         else {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            shape.map(function (current, index) {
+            shape.map(function (current) {
                 points.push(new Point(current['point']['x'], current['point']['y']));
             });
         }
         return points;
     };
-    // eslint-disable-next-line valid-jsdoc
     /**
      * To check and trigger bubble click event
      *
+     * @param {PointerEvent} e - Specifies the pointer event argument.
+     * @returns {void}
      * @private
      */
     Bubble.prototype.bubbleClick = function (e) {
@@ -9926,6 +10092,8 @@ var Bubble = /** @__PURE__ @class */ (function () {
     /**
      * To check and trigger bubble move event
      *
+     * @param {PointerEvent} e - Specifies the pointer event argument.
+     * @retruns {void}
      * @private
      */
     Bubble.prototype.bubbleMove = function (e) {
@@ -10016,6 +10184,7 @@ var DataLabel = /** @__PURE__ @class */ (function () {
         var _this = this;
         var dataLabel = layer.dataLabelSettings;
         var style = layer.dataLabelSettings.textStyle;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var templateFn;
         var options;
         var dataLabelSettings = layer.dataLabelSettings;
@@ -10026,7 +10195,6 @@ var DataLabel = /** @__PURE__ @class */ (function () {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var shapeData = shape;
         var element;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var text = '';
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var datasrcObj;
@@ -10165,7 +10333,6 @@ var DataLabel = /** @__PURE__ @class */ (function () {
                 if (eventargs_1.cancel) {
                     return;
                 }
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var position = [];
                 var width = zoomLabelsPosition && scaleZoomValue > 1 && !_this.maps.zoomNotApplied
                     && _this.maps.zoomShapeCollection.length > index ? _this.maps.zoomShapeCollection[index]['width'] :
@@ -10286,8 +10453,8 @@ var DataLabel = /** @__PURE__ @class */ (function () {
                     }
                     if (trimmedLable.length > 1) {
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        var border_1 = eventargs_1.border;
-                        if (border_1['width'] > 1) {
+                        var border = eventargs_1.border;
+                        if (border['width'] > 1) {
                             var fill = eventargs_1.fill;
                             var opacity = dataLabelSettings.opacity;
                             var rx = dataLabelSettings.rx;
@@ -10303,8 +10470,8 @@ var DataLabel = /** @__PURE__ @class */ (function () {
                                 x = ((location['x'] + transPoint['x']) * scale) - textSize['width'] / 2;
                                 y = ((location['y'] + transPoint['y']) * scale) - textSize['height'] / 2;
                             }
-                            border_1.opacity = isNullOrUndefined(border_1.opacity) ? opacity : border_1.opacity;
-                            var rectOptions = new RectOption(_this.maps.element.id + '_LayerIndex_' + layerIndex + '_shapeIndex_' + index + '_rectIndex_' + index, fill, border_1, opacity, new Rect((x + labelArgs.offsetX), (y + labelArgs.offsetY), textSize['width'], textSize['height']), rx, ry);
+                            border.opacity = isNullOrUndefined(border.opacity) ? opacity : border.opacity;
+                            var rectOptions = new RectOption(_this.maps.element.id + '_LayerIndex_' + layerIndex + '_shapeIndex_' + index + '_rectIndex_' + index, fill, border, opacity, new Rect((x + labelArgs.offsetX), (y + labelArgs.offsetY), textSize['width'], textSize['height']), rx, ry);
                             var rect = _this.maps.renderer.drawRectangle(rectOptions);
                             group.appendChild(rect);
                         }
@@ -10351,7 +10518,7 @@ var DataLabel = /** @__PURE__ @class */ (function () {
         }
         else {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            shapes.map(function (current, index) {
+            shapes.map(function (current) {
                 points.push(new Point(current['point']['x'], current['point']['y']));
             });
         }
@@ -10366,7 +10533,6 @@ var DataLabel = /** @__PURE__ @class */ (function () {
         return 'DataLabel';
     };
     /**
-     *
      * @returns {void}
      * @private
      */
@@ -10385,123 +10551,130 @@ var NavigationLine = /** @__PURE__ @class */ (function () {
     function NavigationLine(maps) {
         this.maps = maps;
     }
-    // eslint-disable-next-line valid-jsdoc
     /**
      * To render navigation line for maps
+     *
+     * @param {LayerSettings} layer - Specifies the layer instance to which the navigation line is to be rendered.
+     * @param {number} factor - Specifies the current zoom factor of the Maps.
+     * @param {number} layerIndex -Specifies the index of current layer.
+     * @returns {Element} - Returns the navigation line element.
      */
     NavigationLine.prototype.renderNavigation = function (layer, factor, layerIndex) {
-        var navigationEle;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var navigation = layer.navigationLineSettings;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var longitude;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var point = [];
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var latitude;
-        var visible;
-        var angle;
-        var width;
-        var color;
-        var dashArray;
-        var pathOption;
-        var direction;
-        var showArrow;
-        var arrowColor;
-        var arrowSize;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var arrowSettings;
-        var arrowPosition;
-        var startArrow;
-        var endArrow;
-        var offSet;
-        var offSetValue;
-        var navigationGroup;
-        var d;
-        var group = (this.maps.renderer.createGroup({
-            id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_line_Group'
-        }));
-        for (var i = 0; i < navigation.length; i++) {
-            latitude = navigation[i]['properties']['latitude'];
-            longitude = navigation[i]['properties']['longitude'];
-            visible = navigation[i]['properties']['visible'];
-            angle = navigation[i]['angle'];
-            width = navigation[i]['width'] || 1;
-            color = navigation[i]['color'];
-            dashArray = navigation[i]['properties']['dashArray'];
-            arrowSettings = navigation[i]['properties']['arrowSettings'];
-            showArrow = (isNullOrUndefined(arrowSettings)) ? false : arrowSettings['properties']['showArrow'];
-            if (longitude['length'] === latitude['length'] && visible) {
-                for (var i_1 = 0; i_1 < longitude['length']; i_1++) {
-                    var location_1 = (this.maps.isTileMap) ? convertTileLatLongToPoint(new Point(longitude[i_1], latitude[i_1]), factor, this.maps.tileTranslatePoint, true) : convertGeoToPoint(latitude[i_1], longitude[i_1], factor, layer, this.maps);
-                    point.push(location_1);
-                }
-            }
-            navigationGroup = (this.maps.renderer.createGroup({
-                id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationGroup' + i + ''
+        var group;
+        if (!isNullOrUndefined(this.maps)) {
+            var navigationEle = void 0;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var navigation = layer.navigationLineSettings;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var longitude = void 0;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var point = [];
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var latitude = void 0;
+            var visible = void 0;
+            var angle = void 0;
+            var width = void 0;
+            var color = void 0;
+            var dashArray = void 0;
+            var pathOption = void 0;
+            var direction = void 0;
+            var showArrow = void 0;
+            var arrowColor = void 0;
+            var arrowSize = void 0;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var arrowSettings = void 0;
+            var arrowPosition = void 0;
+            var startArrow = void 0;
+            var endArrow = void 0;
+            var offSet = void 0;
+            var offSetValue = void 0;
+            var navigationGroup = void 0;
+            var d = void 0;
+            group = (this.maps.renderer.createGroup({
+                id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_line_Group'
             }));
-            for (var j = 0; j < point['length'] - 1; j++) {
-                angle = (-1 > angle) ? -1 : angle;
-                angle = (1 < angle) ? 1 : angle;
-                var arcId = this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationIndex_' + i + '_Line' + j + '';
-                var radius = this.convertRadius(point[j], point[j + 1]);
-                if (angle <= 1 && angle > 0) {
-                    direction = 0;
-                    if (point[j]['x'] > point[j + 1]['x']) {
-                        direction = 1;
-                    }
-                }
-                if (angle >= -1 && angle < 0) {
-                    direction = 1;
-                    if (point[j]['x'] > point[j + 1]['x']) {
+            for (var i = 0; i < navigation.length; i++) {
+                latitude = navigation[i]['properties']['latitude'];
+                longitude = navigation[i]['properties']['longitude'];
+                visible = navigation[i]['properties']['visible'];
+                angle = navigation[i]['angle'];
+                width = navigation[i]['width'] || 1;
+                color = navigation[i]['color'];
+                dashArray = navigation[i]['properties']['dashArray'];
+                arrowSettings = navigation[i]['properties']['arrowSettings'];
+                showArrow = (isNullOrUndefined(arrowSettings)) ? false : arrowSettings['properties']['showArrow'];
+                if (longitude['length'] === latitude['length'] && visible) {
+                    for (var i_1 = 0; i_1 < longitude['length']; i_1++) {
+                        var location_1 = (this.maps.isTileMap) ? convertTileLatLongToPoint(new Point(longitude[i_1], latitude[i_1]), factor, this.maps.tileTranslatePoint, true) : convertGeoToPoint(latitude[i_1], longitude[i_1], factor, layer, this.maps);
+                        point.push(location_1);
+                    }
+                }
+                navigationGroup = (this.maps.renderer.createGroup({
+                    id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationGroup' + i + ''
+                }));
+                for (var j = 0; j < point['length'] - 1; j++) {
+                    angle = (-1 > angle) ? -1 : angle;
+                    angle = (1 < angle) ? 1 : angle;
+                    var arcId = this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationIndex_' + i + '_Line' + j + '';
+                    var radius = this.convertRadius(point[j], point[j + 1]);
+                    if (angle <= 1 && angle > 0) {
                         direction = 0;
+                        if (point[j]['x'] > point[j + 1]['x']) {
+                            direction = 1;
+                        }
                     }
-                }
-                if (showArrow) {
-                    arrowColor = arrowSettings['properties']['color'];
-                    arrowSize = arrowSettings['properties']['size'];
-                    offSetValue = (arrowSettings['properties']['offSet'] === undefined) ? 0 : arrowSettings['properties']['offSet'];
-                    var divide = (Math.round(arrowSize / 2));
-                    arrowPosition = arrowSettings['properties']['position'];
-                    startArrow = (arrowPosition === 'Start') ? 'url(#triangle' + i + ')' : null;
-                    endArrow = (arrowPosition === 'End') ? 'url(#triangle' + i + ')' : null;
-                    if (offSet !== 0 && angle === 0) {
-                        offSet = (arrowPosition === 'Start') ? offSetValue : -(offSetValue);
-                    }
-                    offSet = (isNullOrUndefined(offSet)) ? 0 : offSet;
-                    var triId = this.maps.element.id + '_triangle';
-                    var defElement = this.maps.renderer.createDefs();
-                    defElement.innerHTML += '<marker id="' + 'triangle' + i + '"></marker>';
-                    var markerEle = defElement.querySelector('#' + 'triangle' + i);
-                    markerEle.setAttribute('markerWidth', (arrowSize.toString()));
-                    markerEle.setAttribute('markerHeight', (arrowSize.toString()));
-                    markerEle.setAttribute('refX', (divide - offSet).toString());
-                    markerEle.setAttribute('refY', divide.toString());
-                    markerEle.setAttribute('orient', 'auto');
-                    var d2 = 'M 0,0  L 0,' + arrowSize + ' L ' + divide + ', ' + divide + ' Z';
-                    pathOption = new PathOption(triId, arrowColor, width, color, 1, 1, dashArray, d2);
+                    if (angle >= -1 && angle < 0) {
+                        direction = 1;
+                        if (point[j]['x'] > point[j + 1]['x']) {
+                            direction = 0;
+                        }
+                    }
+                    if (showArrow) {
+                        arrowColor = arrowSettings['properties']['color'];
+                        arrowSize = arrowSettings['properties']['size'];
+                        offSetValue = (arrowSettings['properties']['offSet'] === undefined) ? 0 : arrowSettings['properties']['offSet'];
+                        var divide = (Math.round(arrowSize / 2));
+                        arrowPosition = arrowSettings['properties']['position'];
+                        startArrow = (arrowPosition === 'Start') ? 'url(#triangle' + i + ')' : null;
+                        endArrow = (arrowPosition === 'End') ? 'url(#triangle' + i + ')' : null;
+                        if (offSet !== 0 && angle === 0) {
+                            offSet = (arrowPosition === 'Start') ? offSetValue : -(offSetValue);
+                        }
+                        offSet = (isNullOrUndefined(offSet)) ? 0 : offSet;
+                        var triId = this.maps.element.id + '_triangle';
+                        var defElement = this.maps.renderer.createDefs();
+                        defElement.innerHTML += '<marker id="' + 'triangle' + i + '"></marker>';
+                        var markerEle = defElement.querySelector('#' + 'triangle' + i);
+                        markerEle.setAttribute('markerWidth', (arrowSize.toString()));
+                        markerEle.setAttribute('markerHeight', (arrowSize.toString()));
+                        markerEle.setAttribute('refX', (divide - offSet).toString());
+                        markerEle.setAttribute('refY', divide.toString());
+                        markerEle.setAttribute('orient', 'auto');
+                        var d2 = 'M 0,0  L 0,' + arrowSize + ' L ' + divide + ', ' + divide + ' Z';
+                        pathOption = new PathOption(triId, arrowColor, width, color, 1, 1, dashArray, d2);
+                        navigationEle = this.maps.renderer.drawPath(pathOption);
+                        markerEle.appendChild(navigationEle);
+                        defElement.appendChild(markerEle);
+                        navigationGroup.appendChild(defElement);
+                    }
+                    angle = Math.abs(angle);
+                    d = (angle === 0) ? 'M ' + point[j]['x'] + ',' + point[j]['y'] + 'L ' + point[j + 1]['x']
+                        + ',' + point[j + 1]['y'] + ' ' :
+                        'M ' + point[j]['x'] + ',' + point[j]['y'] + ' A ' + (radius / 2 + (1 - angle) * radius / (angle * 10)) +
+                            ' ' + (radius / 2 + (1 - angle) * radius / (angle * 10)) + ' ' + 0 + ',' + 0 + ','
+                            + direction + ' , ' + point[j + 1]['x'] + ',' + point[j + 1]['y'] + ' ';
+                    pathOption = new PathOption(arcId, 'none', width, color, 1, 1, dashArray, d);
                     navigationEle = this.maps.renderer.drawPath(pathOption);
-                    markerEle.appendChild(navigationEle);
-                    defElement.appendChild(markerEle);
-                    navigationGroup.appendChild(defElement);
-                }
-                angle = Math.abs(angle);
-                d = (angle === 0) ? 'M ' + point[j]['x'] + ',' + point[j]['y'] + 'L ' + point[j + 1]['x']
-                    + ',' + point[j + 1]['y'] + ' ' :
-                    'M ' + point[j]['x'] + ',' + point[j]['y'] + ' A ' + (radius / 2 + (1 - angle) * radius / (angle * 10)) +
-                        ' ' + (radius / 2 + (1 - angle) * radius / (angle * 10)) + ' ' + 0 + ',' + 0 + ','
-                        + direction + ' , ' + point[j + 1]['x'] + ',' + point[j + 1]['y'] + ' ';
-                pathOption = new PathOption(arcId, 'none', width, color, 1, 1, dashArray, d);
-                navigationEle = this.maps.renderer.drawPath(pathOption);
-                if (!isNullOrUndefined(arrowPosition)) {
-                    var position = (arrowPosition === 'Start') ? navigationEle.setAttribute('marker-start', startArrow)
-                        : navigationEle.setAttribute('marker-end', endArrow);
-                }
-                maintainSelection(this.maps.selectedNavigationElementId, this.maps.navigationSelectionClass, navigationEle, 'navigationlineselectionMapStyle');
-                navigationGroup.appendChild(navigationEle);
-                group.appendChild(navigationGroup);
-            }
-            point = [];
+                    if (!isNullOrUndefined(arrowPosition)) {
+                        var position = (arrowPosition === 'Start') ? navigationEle.setAttribute('marker-start', startArrow)
+                            : navigationEle.setAttribute('marker-end', endArrow);
+                    }
+                    maintainSelection(this.maps.selectedNavigationElementId, this.maps.navigationSelectionClass, navigationEle, 'navigationlineselectionMapStyle');
+                    navigationGroup.appendChild(navigationEle);
+                    group.appendChild(navigationGroup);
+                }
+                point = [];
+            }
         }
         return group;
     };
@@ -11011,15 +11184,16 @@ var Legend = /** @__PURE__ @class */ (function () {
                 var textId = map.element.id + '_Legend_Text_Index_' + collection['idIndex'];
                 var shapeLocation = new Point(collection['Shape']['x'], (collection['Shape']['y'] - pagingArrowPadding));
                 var textLocation = new Point(collection['Text']['x'], (collection['Text']['y'] - pagingArrowPadding));
-                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, '');
+                var renderOptions = new PathOption(shapeId, collection['Fill'], strokeWidth, strokeColor, legend.opacity, isNullOrUndefined(shapeBorder.opacity) ? legend.opacity : shapeBorder.opacity, '');
                 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
+                    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;
-                legendTextStyle.fontFamily = !isNullOrUndefined(legendTextStyle.fontFamily) ? legendTextStyle.fontFamily : this.maps.themeStyle.fontFamily;
+                legendTextStyle.fontFamily = !isNullOrUndefined(legendTextStyle.fontFamily) ? legendTextStyle.fontFamily :
+                    this.maps.themeStyle.fontFamily;
                 legendTextStyle.size = map.themeStyle.legendFontSize || legendTextStyle.size;
                 if (i === 0) {
                     this.renderLegendBorder();
@@ -11029,11 +11203,11 @@ var Legend = /** @__PURE__ @class */ (function () {
                     var marker$$1 = map.layers[legendShapeData['layerIndex']].markerSettings[legendShapeData['markerIndex']];
                     legendShape = !isNullOrUndefined(marker$$1.dataSource[legendShapeData['dataIndex']][marker$$1['shapeValuePath']]) && marker$$1.dataSource[legendShapeData['dataIndex']][marker$$1['shapeValuePath']] !== '' ? marker$$1.dataSource[legendShapeData['dataIndex']][marker$$1['shapeValuePath']] : marker$$1.shape;
                 }
-                if (legendShape === "Balloon") {
-                    legendElement.appendChild(drawBalloon(map, renderOptions_1, shapeSize, { x: shapeLocation.x, y: (shapeLocation.y + 5) }, 'Legend'));
+                if (legendShape === 'Balloon') {
+                    legendElement.appendChild(drawBalloon(map, renderOptions, shapeSize, { x: shapeLocation.x, y: (shapeLocation.y + 5) }, 'Legend'));
                 }
                 else {
-                    legendElement.appendChild(drawSymbol(shapeLocation, legendShape, shapeSize, collection['ImageSrc'], renderOptions_1));
+                    legendElement.appendChild(drawSymbol(shapeLocation, legendShape, shapeSize, collection['ImageSrc'], renderOptions));
                 }
                 var legendRectSize = collection['Rect']['x'] + collection['Rect']['width'];
                 if (legendRectSize > this.legendBorderRect.width) {
@@ -11507,8 +11681,6 @@ var Legend = /** @__PURE__ @class */ (function () {
                     }
                     if (selectionEle && (selectionEle['IsSelected'] && (targetElement.getAttribute('class') === 'ShapeselectionMapStyle'
                         || targetElement.getAttribute('class') === 'LineselectionMapStyle'))) {
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        var element = this.maps.legendSelectionCollection[selectionEle['SelectionIndex']];
                         var multiSelection = 0;
                         if (module.enableMultiSelect) {
                             for (var i = 0; i < shapeElement['Elements'].length; i++) {
@@ -11767,7 +11939,8 @@ var Legend = /** @__PURE__ @class */ (function () {
         var legendTitle = legend.title.text;
         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
+            fontWeight: legend.titleStyle.fontWeight, size: legend.titleStyle.size, color: legend.titleStyle.color,
+            opacity: legend.titleStyle.opacity
         };
         var textOptions;
         var spacing = 10;
@@ -11828,7 +12001,8 @@ var Legend = /** @__PURE__ @class */ (function () {
         var locationX = !isNullOrUndefined(legend.location.x) ? legend.location.x : 0;
         var locationY = !isNullOrUndefined(legend.location.y) ? legend.location.y : 0;
         if (legend.position === 'Float') {
-            this.translate = map.isTileMap ? new Point(locationX, locationY + (spacing / 4)) : new Point(locationX + map.mapAreaRect.x, locationY + map.mapAreaRect.y);
+            this.translate = map.isTileMap ? new Point(locationX, locationY + (spacing / 4)) :
+                new Point(locationX + map.mapAreaRect.x, locationY + map.mapAreaRect.y);
             this.legendTotalRect = map.mapAreaRect;
         }
         else {
@@ -11911,7 +12085,8 @@ var Legend = /** @__PURE__ @class */ (function () {
                         _this.getOverallLegendItemsCollection(text, legendFill, newData, showLegend);
                     }
                     else {
-                        newData.push({ layerIndex: layerIndex, markerIndex: markerIndex, dataIndex: dataIndex, value: legendFill, name: text,
+                        newData.push({ layerIndex: layerIndex, markerIndex: markerIndex, dataIndex: dataIndex, value: legendFill,
+                            name: text,
                             shape: (!isNullOrUndefined(marker$$1.shapeValuePath) && !isNullOrUndefined(data[marker$$1.shapeValuePath]) && data[marker$$1.shapeValuePath] !== '') ? data[marker$$1.shapeValuePath] : (_this.maps.legendSettings.useMarkerShape ? marker$$1.shape : _this.maps.legendSettings.shape) });
                         _this.getOverallLegendItemsCollection(text, legendFill, newData, showLegend);
                     }
@@ -12098,6 +12273,7 @@ var Legend = /** @__PURE__ @class */ (function () {
                 if (outOfRangeValues.length === 0) {
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     var range_1 = false;
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     Array.prototype.forEach.call(dataSource, function (data, dataIndex) {
                         range_1 = false;
                         var rangeValue = data[colorValuePath];
@@ -12551,10 +12727,12 @@ var Legend = /** @__PURE__ @class */ (function () {
                                     this.maps.toggledShapeElementId.splice(toggledShapeIdIndex, 1);
                                 }
                                 mapLegendElement.setAttribute('fill-opacity', (this.maps.layers[k].shapeSettings.opacity).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-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());
+                                    this.maps.layers[k].shapeSettings.opacity :
+                                    this.maps.layers[k].shapeSettings.border.opacity).toString());
                                 mapLegendElement.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
                                 if (targetEle !== null) {
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex + '_Text', this.maps.element.id);
@@ -12618,7 +12796,7 @@ var Legend = /** @__PURE__ @class */ (function () {
                     && isNaN(shapeData['properties'][shapePath]) ?
                     shapeData['properties'][shapePath].toLowerCase() : shapeData['properties'][shapePath];
                 if (shapeDataValueCase === dataPathValueCase) {
-                    if (shapeData['geometry']['type'] != 'MultiPoint') {
+                    if (shapeData['geometry']['type'] !== 'MultiPoint') {
                         legendData.push({
                             layerIndex: layerIndex, shapeIndex: i, dataIndex: dataIndex,
                             name: data[dataPath], value: value, pointIndex: -1
@@ -12864,7 +13042,9 @@ var Highlight = /** @__PURE__ @class */ (function () {
         }
         var borderColor = (targetEle.parentElement.id.indexOf('LineString') === -1) ? this.highlightSettings.border.color : (this.highlightSettings.fill || this.highlightSettings.border.color);
         var borderWidth = (targetEle.parentElement.id.indexOf('LineString') === -1) ? (this.highlightSettings.border.width / (isMarkerSelect ? 1 : this.maps.scale)) : (this.highlightSettings.border.width / this.maps.scale);
-        var borderOpacity = isNullOrUndefined(this.highlightSettings.border.opacity) ? this.highlightSettings.opacity : this.highlightSettings.border.opacity;
+        var borderOpacity = isNullOrUndefined(this.highlightSettings.border.opacity) ? this.highlightSettings.opacity :
+            this.highlightSettings.border.opacity;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var eventArgs = {
             opacity: this.highlightSettings.opacity,
             fill: (targetEle.parentElement.id.indexOf('LineString') === -1) ? (targetEle.id.indexOf('NavigationIndex') === -1 ? !isNullOrUndefined(this.highlightSettings.fill)
@@ -12884,6 +13064,7 @@ var Highlight = /** @__PURE__ @class */ (function () {
             maps: this.maps
         };
         if (targetEle.id.indexOf('shapeIndex') > -1) {
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
             this.maps.trigger(shapeHighlight, shapeEventArgs, function () { });
         }
         var itemEventArgs = {
@@ -13087,7 +13268,8 @@ var Selection = /** @__PURE__ @class */ (function () {
         var isLineStringShape = targetElement.parentElement.id.indexOf('LineString') > -1;
         var selectionsettings = this.selectionsettings;
         var border = {
-            color: isLineStringShape ? (this.selectionsettings.fill || this.selectionsettings.border.color) : this.selectionsettings.border.color,
+            color: isLineStringShape ? (this.selectionsettings.fill || this.selectionsettings.border.color) :
+                this.selectionsettings.border.color,
             width: isLineStringShape ? (this.selectionsettings.border.width / this.maps.scale) :
                 (this.selectionsettings.border.width / (this.selectionType === 'Marker' ? 1 : this.maps.scale)),
             opacity: this.selectionsettings.border.opacity
@@ -13104,7 +13286,8 @@ var Selection = /** @__PURE__ @class */ (function () {
             maps: this.maps
         };
         this.maps.trigger('itemSelection', eventArgs, function (observedArgs) {
-            eventArgs.border.opacity = isNullOrUndefined(_this.selectionsettings.border.opacity) ? _this.selectionsettings.opacity : _this.selectionsettings.border.opacity;
+            eventArgs.border.opacity = isNullOrUndefined(_this.selectionsettings.border.opacity) ?
+                _this.selectionsettings.opacity : _this.selectionsettings.border.opacity;
             if (!eventArgs.cancel) {
                 if (targetElement.getAttribute('class') === _this.selectionType + 'selectionMapStyle'
                     || targetElement.getAttribute('class') === 'LineselectionMapStyle') {
@@ -13257,7 +13440,6 @@ var Selection = /** @__PURE__ @class */ (function () {
     return Selection;
 }());
 
-/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * Map Tooltip
  */
@@ -13290,7 +13472,6 @@ var MapsTooltip = /** @__PURE__ @class */ (function () {
         }
         var option;
         var currentData = '';
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var targetId = target.id;
         var tooltipEle;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -13439,6 +13620,7 @@ var MapsTooltip = /** @__PURE__ @class */ (function () {
                 maps: this.maps,
                 element: target, eventArgs: e, content: !isNullOrUndefined(currentData) ? currentData.toString() : ''
             };
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
             this.maps.trigger(tooltipRender, tooltipArgs, function (args) {
                 if (!tooltipArgs.cancel && option.visible && !isNullOrUndefined(currentData) &&
                     (targetId.indexOf('_cluster_') === -1 && targetId.indexOf('_dataLabel_') === -1)) {
@@ -13455,7 +13637,8 @@ var MapsTooltip = /** @__PURE__ @class */ (function () {
                             header: '',
                             data: option['data'],
                             template: option['template'],
-                            content: tooltipArgs.content.toString() != currentData.toString() ? [tooltipArgs.content.toString()] : [currentData.toString()],
+                            content: tooltipArgs.content.toString() !== currentData.toString() ? [tooltipArgs.content.toString()] :
+                                [currentData.toString()],
                             shapes: [],
                             location: option['location'],
                             palette: [markerFill],
@@ -13471,7 +13654,8 @@ var MapsTooltip = /** @__PURE__ @class */ (function () {
                             header: '',
                             data: tooltipArgs.options['data'],
                             template: tooltipArgs.options['template'],
-                            content: tooltipArgs.content.toString() != currentData.toString() ? [tooltipArgs.content.toString()] : [currentData.toString()],
+                            content: tooltipArgs.content.toString() !== currentData.toString() ? [tooltipArgs.content.toString()] :
+                                [currentData.toString()],
                             shapes: [],
                             location: tooltipArgs.options['location'],
                             palette: [markerFill],
@@ -13787,6 +13971,7 @@ var Zoom = /** @__PURE__ @class */ (function () {
         }
         this.maps.zoomNotApplied = false;
     };
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     Zoom.prototype.calculateInitalZoomTranslatePoint = function (newZoomFactor, mapTotalWidth, mapTotalHeight, availSize, minBounds, map) {
         mapTotalWidth *= newZoomFactor;
         mapTotalHeight *= newZoomFactor;
@@ -14048,7 +14233,7 @@ var Zoom = /** @__PURE__ @class */ (function () {
                                     layerElement.appendChild(maps.navigationLineModule.renderNavigation(this.currentLayer, maps.tileZoomLevel, this.index));
                                 }
                             }
-                            else if (currentEle.id.indexOf('Legend') == -1) {
+                            else if (currentEle.id.indexOf('Legend') === -1) {
                                 changeBorderWidth(currentEle, this.index, scale, maps);
                                 maps.zoomTranslatePoint = maps.translatePoint;
                                 this.animateTransform(currentEle, animate$$1, x, y, scale);
@@ -14126,7 +14311,6 @@ var Zoom = /** @__PURE__ @class */ (function () {
                             var childElement = void 0;
                             for (var k = 0; k < currentEle.childElementCount; k++) {
                                 childElement = currentEle.childNodes[k];
-                                var bubbleTransform = childElement.getAttribute('transform');
                                 layerIndex = parseFloat(childElement.id.split('_LayerIndex_')[1].split('_')[0]);
                                 var bubleIndex = parseFloat(childElement.id.split('_BubbleIndex_')[1].split('_')[0]);
                                 var dataIndex = parseFloat(childElement.id.split('_BubbleIndex_')[1].split('_')[2]);
@@ -14257,7 +14441,6 @@ var Zoom = /** @__PURE__ @class */ (function () {
                         var markerID = _this.maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'
                             + markerIndex + '_dataIndex_' + dataIndex;
                         var location_1 = (_this.maps.isTileMap) ? convertTileLatLongToPoint(new MapLocation(long, lati), _this.maps.tileZoomLevel, _this.maps.tileTranslatePoint, true) : convertGeoToPoint(lati, long, factor, currentLayers, _this.maps);
-                        var animate_1 = currentLayers.animationDuration !== 0 || isNullOrUndefined(_this.maps.zoomModule);
                         var transPoint = { x: x, y: y };
                         if (eventArgs.template && (!isNaN(location_1.x) && !isNaN(location_1.y))) {
                             markerTemplateCounts++;
@@ -14327,15 +14510,12 @@ var Zoom = /** @__PURE__ @class */ (function () {
         if (animate$$1 === void 0) { animate$$1 = false; }
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var labelCollection = this.maps.dataLabelModule.dataLabelCollections;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var zoomelement = element.getBoundingClientRect();
         var text;
         var trimmedLable;
         var style = this.maps.layers[this.index].dataLabelSettings.textStyle;
         var zoomtext;
         var zoomtextSize;
         var zoomtrimLabel;
-        var labelPath = this.maps.layers[this.index].dataLabelSettings.labelPath;
         var layerIndex = parseFloat(element.id.split('_LayerIndex_')[1].split('_')[0]);
         var shapeIndex = parseFloat(element.id.split('_shapeIndex_')[1].split('_')[0]);
         var labelIndex;
@@ -14363,7 +14543,6 @@ var Zoom = /** @__PURE__ @class */ (function () {
                         var layerEle = getElementByID(this.maps.element.id + '_Layer_Collections');
                         labelX = ((Math.abs(this.maps.baseMapRectBounds['min']['x'] - labelX)) * scale);
                         labelY = ((Math.abs(this.maps.baseMapRectBounds['min']['y'] - labelY)) * scale);
-                        var templateOffset = element.getBoundingClientRect();
                         var layerOffset = layerEle.getBoundingClientRect();
                         var elementOffset = element.parentElement.getBoundingClientRect();
                         locationX = ((labelX) + (layerOffset.left - elementOffset.left));
@@ -14561,6 +14740,11 @@ var Zoom = /** @__PURE__ @class */ (function () {
         }
     };
     /**
+     * @param {PanDirection} direction - Specifies the direction of the panning.
+     * @param {number} xDifference - Specifies the distance moved in the horizontal direction.
+     * @param {number} yDifference - Specifies the distance moved in the vertical direction.
+     * @param {PointerEvent | TouchEvent | KeyboardEvent} mouseLocation - Specifies the pointer event argument.
+     * @returns {void}
      * @private
      */
     Zoom.prototype.panning = function (direction, xDifference, yDifference, mouseLocation) {
@@ -15357,7 +15541,6 @@ var Zoom = /** @__PURE__ @class */ (function () {
     return Zoom;
 }());
 
-/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * This module enables the print functionality in maps.
  *
@@ -15367,14 +15550,16 @@ var Print = /** @__PURE__ @class */ (function () {
     /**
      * Constructor for Maps
      *
-     * @param {Maps} control - Specifies the instance of the map
+     * @param {Maps} control - Specifies the instance of the Maps
      */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
     function Print(control) {
     }
     /**
      * To print the Maps
      *
-     * @param {string[] | string | Element} elements - Specifies the element
+     * @param {Maps} maps -Specifies the Maps instance.
+     * @param {string[] | string | Element} elements - Specifies the element of the Maps
      * @returns {void}
      * @private
      */
@@ -15394,6 +15579,7 @@ var Print = /** @__PURE__ @class */ (function () {
     /**
      * To get the html string of the Maps
      *
+     * @param {Maps} maps -Specifies the Maps instance.
      * @param {string[] | string | Element} elements - Specifies the html element
      * @returns {Element} - Returns the div element
      * @private
@@ -15453,11 +15639,11 @@ var Print = /** @__PURE__ @class */ (function () {
      * @returns {void}
      * @private
      */
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
     Print.prototype.destroy = function () { };
     return Print;
 }());
 
-/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * This module enables the export to Image functionality in Maps control.
  *
@@ -15469,19 +15655,21 @@ var ImageExport = /** @__PURE__ @class */ (function () {
      *
      * @param {Maps} control - Specifies the instance of the map
      */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
     function ImageExport(control) {
     }
     /**
      * To export the file as image/svg format
      *
-     * @param {ExportType} type - Specifies the type of the image file
-     * @param {string} fileName - Specifies the file name of the image file
+     * @param {Maps} maps - Specifies the Maps instance.
+     * @param {ExportType} type - Specifies the type of the image file for exporting.
+     * @param {string} fileName - Specifies the file name of the image file for exporting.
      * @param {boolean} allowDownload - Specifies whether to download image as a file or not.
-     * @returns {Promise<string>} - Returns the promise string.
+     * @returns {Promise<string>} - Specifies the base64 string of the exported image which is returned when the allowDownload is set to false.
      * @private
      */
     ImageExport.prototype.export = function (maps, type, fileName, allowDownload) {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
         var promise = new Promise(function (resolve, reject) {
             var imageCanvasElement = createElement('canvas', {
                 id: 'ej2-canvas',
@@ -15491,7 +15679,6 @@ var ImageExport = /** @__PURE__ @class */ (function () {
                 }
             });
             var isDownload = !(Browser.userAgent.toString().indexOf('HeadlessChrome') > -1);
-            var toolbarEle = document.getElementById(maps.element.id + '_ToolBar');
             var svgParent = document.getElementById(maps.element.id + '_Tile_SVG_Parent');
             var svgDataElement;
             var tileSvg;
@@ -15625,11 +15812,11 @@ var ImageExport = /** @__PURE__ @class */ (function () {
      * @returns {void}
      * @private
      */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
     ImageExport.prototype.destroy = function () { };
     return ImageExport;
 }());
 
-/* eslint-disable @typescript-eslint/no-unused-vars */
 /**
  * This module enables the export to PDF functionality in Maps control.
  *
@@ -15639,18 +15826,19 @@ var PdfExport = /** @__PURE__ @class */ (function () {
     /**
      * Constructor for Maps
      *
-     * @param {Maps} control Specifies the instance of the map
      */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
     function PdfExport() {
     }
     /**
      * To export the file as image/svg format
      *
-     * @param {ExportType} type - Specifies the type of the document
-     * @param {string} fileName - Specifies the file name of the document
-     * @param {boolean} allowDownload - Specifies whether to download the document or not
-     * @param {PdfPageOrientation} orientation - Specifies the orientation of the PDF document to export the component
-     * @returns {Promise<string>} - Returns the promise string
+     * @param {Maps} maps - Specifies the Maps instance.
+     * @param {ExportType} type - Specifies the type of the document.
+     * @param {string} fileName - Specifies the name of the PDF document.
+     * @param {boolean} allowDownload - Specifies whether to download the document or not.
+     * @param {PdfPageOrientation} orientation - Specifies the orientation of the PDF document to export the component.
+     * @returns {Promise<string>} - Returns "null" value when the allowDownload is set to false.
      * @private
      */
     PdfExport.prototype.export = function (maps, type, fileName, allowDownload, orientation) {
@@ -15786,6 +15974,7 @@ var PdfExport = /** @__PURE__ @class */ (function () {
      * @returns {void}
      * @private
      */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
     PdfExport.prototype.destroy = function () { };
     return PdfExport;
 }());