@syncfusion/ej2-maps 20.2.43 → 20.3.47

package/src/maps/layers/navigation-selected-line.js

@@ -29,9 +29,6 @@ var NavigationLine = /** @class */ (function () {
         var dashArray;
         var pathOption;
         var direction;
-        var markerWidth;
-        var arcId;
-        var radius;
         var showArrow;
         var arrowColor;
         var arrowSize;
@@ -69,8 +66,8 @@ var NavigationLine = /** @class */ (function () {
             for (var j = 0; j < point['length'] - 1; j++) {
                 angle = (-1 > angle) ? -1 : angle;
                 angle = (1 < angle) ? 1 : angle;
-                var arcId_1 = this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationIndex_' + i + '_Line' + j + '';
-                var radius_1 = this.convertRadius(point[j], point[j + 1]);
+                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']) {
@@ -115,10 +112,10 @@ var NavigationLine = /** @class */ (function () {
                     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_1 / 2 + (1 - angle) * radius_1 / (angle * 10)) +
-                            ' ' + (radius_1 / 2 + (1 - angle) * radius_1 / (angle * 10)) + ' ' + 0 + ',' + 0 + ','
+                        '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_1, 'none', width, color, 1, 1, dashArray, d);
+                    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)
@@ -151,14 +148,11 @@ var NavigationLine = /** @class */ (function () {
     /**
      * To destroy the layers.
      *
-     * @param {Maps} maps - Specifies the instance of the map
      * @returns {void}
      * @private
      */
-    NavigationLine.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
+    NavigationLine.prototype.destroy = function () {
+        this.maps = null;
     };
     return NavigationLine;
 }());

package/src/maps/maps.js

@@ -390,7 +390,9 @@ var Maps = /** @class */ (function (_super) {
             this.dataLabelShape = [];
         }
         this.mapLayerPanel.measureLayerPanel();
-        this.element.appendChild(this.svgObject);
+        if (!isNullOrUndefined(this.svgObject)) {
+            this.element.appendChild(this.svgObject);
+        }
         var position = this.getExtraPosition();
         for (var i = 0; i < this.layers.length; i++) {
             if (position.x !== 0 || position.y !== 0) {
@@ -579,6 +581,7 @@ var Maps = /** @class */ (function (_super) {
      */
     Maps.prototype.addTabIndex = function () {
         this.element.setAttribute('aria-label', this.description || 'Maps Element');
+        this.element.setAttribute('role', '');
         this.element.setAttribute('tabindex', this.tabIndex.toString());
     };
     // private setSecondaryElementPosition(): void {
@@ -643,7 +646,7 @@ var Maps = /** @class */ (function (_super) {
                 }
             }
             if (this.zoomModule && (this.previousScale !== this.scale)) {
-                this.zoomModule.applyTransform(true);
+                this.zoomModule.applyTransform(this, true);
             }
         }
     };
@@ -821,6 +824,7 @@ var Maps = /** @class */ (function (_super) {
             var titleBounds = new Rect(location_1.x, location_1.y, elementSize.width, elementSize.height);
             var element = renderTextElement(options, style, style.color || (type === 'title' ? this.themeStyle.titleFontColor : this.themeStyle.subTitleFontColor), groupEle);
             element.setAttribute('aria-label', this.description || title.text);
+            element.setAttribute('role', '');
             if ((type === 'title' && !title.subtitleSettings.text) || (type === 'subtitle')) {
                 height = Math.abs((titleBounds.y + this.margin.bottom) - this.availableSize.height);
                 this.mapAreaRect = new Rect(this.margin.left, titleBounds.y + 10, width, height - 10);
@@ -1410,7 +1414,7 @@ var Maps = /** @class */ (function (_super) {
                 this.scale = zoomFactor;
                 this.translatePoint.x = ((mapRect.left < svgRect.left ? x : 0) + (size.width / 2) - (position.x * zoomFactor)) / zoomFactor;
                 this.translatePoint.y = ((mapRect.top < svgRect.top ? y : 0) + (size.height / 2) - (position.y * zoomFactor)) / zoomFactor;
-                this.zoomModule.applyTransform();
+                this.zoomModule.applyTransform(this);
             }
             else {
                 position = { x: size.width / 2, y: size.height / 2 };
@@ -1489,7 +1493,7 @@ var Maps = /** @class */ (function (_super) {
                 this.layersCollection[layerIndex].markerSettings.push(new MarkerSettings(this, 'markerSettings', newMarker));
             }
             var markerModule = new Marker(this);
-            markerModule.markerRender(layerEle, layerIndex, this.mapLayerPanel['currentFactor'], 'AddMarker');
+            markerModule.markerRender(this, layerEle, layerIndex, this.mapLayerPanel['currentFactor'], 'AddMarker');
             this.arrangeTemplate();
         }
     };
@@ -1696,7 +1700,8 @@ var Maps = /** @class */ (function (_super) {
             Zoom: 'Zoom',
             ZoomOut: 'Zoom out',
             Pan: 'Pan',
-            Reset: 'Reset'
+            Reset: 'Reset',
+            ImageNotFound: 'Image Not Found'
         };
     };
     /**
@@ -1704,6 +1709,7 @@ var Maps = /** @class */ (function (_super) {
      */
     Maps.prototype.destroy = function () {
         this.unWireEVents();
+        _super.prototype.destroy.call(this);
         this.shapeSelectionItem = [];
         this.toggledShapeElementId = [];
         this.toggledLegendId = [];
@@ -1718,11 +1724,14 @@ var Maps = /** @class */ (function (_super) {
         this.zoomLabelPositions = [];
         this.mouseDownEvent = { x: null, y: null };
         this.mouseClickEvent = { x: null, y: null };
+        this.formatFunction = null;
+        //TODO: Calling the below code throws spec issue.
+        //this.renderer = null;
+        this.availableSize = new Size(0, 0);
         if (document.getElementById('mapsmeasuretext')) {
             document.getElementById('mapsmeasuretext').remove();
         }
         this.removeSvg();
-        _super.prototype.destroy.call(this);
     };
     /**
      * Gets component name
@@ -2038,7 +2047,7 @@ var Maps = /** @class */ (function (_super) {
      */
     Maps.prototype.print = function (id) {
         if ((this.allowPrint) && (this.printModule)) {
-            this.printModule.print(id);
+            this.printModule.print(this, id);
         }
     };
     /**
@@ -2057,12 +2066,12 @@ var Maps = /** @class */ (function (_super) {
         }
         if ((type !== 'PDF') && (this.allowImageExport) && (this.imageExportModule)) {
             return new Promise(function (resolve, reject) {
-                resolve(_this.imageExportModule.export(type, fileName, allowDownload));
+                resolve(_this.imageExportModule.export(_this, type, fileName, allowDownload));
             });
         }
         else if ((this.allowPdfExport) && (this.pdfExportModule)) {
             return new Promise(function (resolve, reject) {
-                resolve(_this.pdfExportModule.export(type, fileName, allowDownload, orientation));
+                resolve(_this.pdfExportModule.export(_this, type, fileName, allowDownload, orientation));
             });
         }
         return null;

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

@@ -6,7 +6,6 @@ import { ExportType } from '../utils/enum';
  * @hidden
  */
 export declare class ImageExport {
-    private control;
     /**
      * Constructor for Maps
      *
@@ -22,7 +21,7 @@ export declare class ImageExport {
      * @returns {Promise<string>} - Returns the promise string.
      * @private
      */
-    export(type: ExportType, fileName: string, allowDownload?: boolean): Promise<string>;
+    export(maps: Maps, type: ExportType, fileName: string, allowDownload?: boolean): Promise<string>;
     /**
      * Get module name.
      *
@@ -32,9 +31,8 @@ export declare class ImageExport {
     /**
      * To destroy the ImageExport.
      *
-     * @param {Maps} maps - Specifies the instance of the maps.
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }

package/src/maps/model/export-image.js

@@ -13,7 +13,6 @@ var ImageExport = /** @class */ (function () {
      * @param {Maps} control - Specifies the instance of the map
      */
     function ImageExport(control) {
-        this.control = control;
     }
     /**
      * To export the file as image/svg format
@@ -24,29 +23,28 @@ var ImageExport = /** @class */ (function () {
      * @returns {Promise<string>} - Returns the promise string.
      * @private
      */
-    ImageExport.prototype.export = function (type, fileName, allowDownload) {
-        var _this = this;
+    ImageExport.prototype.export = function (maps, type, fileName, allowDownload) {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var promise = new Promise(function (resolve, reject) {
             var imageCanvasElement = createElement('canvas', {
                 id: 'ej2-canvas',
                 attrs: {
-                    'width': _this.control.availableSize.width.toString(),
-                    'height': _this.control.availableSize.height.toString()
+                    'width': maps.availableSize.width.toString(),
+                    'height': maps.availableSize.height.toString()
                 }
             });
             var isDownload = !(Browser.userAgent.toString().indexOf('HeadlessChrome') > -1);
-            var toolbarEle = document.getElementById(_this.control.element.id + '_ToolBar');
-            var svgParent = document.getElementById(_this.control.element.id + '_Tile_SVG_Parent');
+            var toolbarEle = document.getElementById(maps.element.id + '_ToolBar');
+            var svgParent = document.getElementById(maps.element.id + '_Tile_SVG_Parent');
             var svgDataElement;
             var tileSvg;
-            var svgObject = getElementByID(_this.control.element.id + '_svg').cloneNode(true);
-            if (!_this.control.isTileMap) {
+            var svgObject = getElementByID(maps.element.id + '_svg').cloneNode(true);
+            if (!maps.isTileMap) {
                 svgDataElement = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">' +
-                    _this.control.svgObject.outerHTML + '</svg>';
+                    maps.svgObject.outerHTML + '</svg>';
             }
             else {
-                tileSvg = getElementByID(_this.control.element.id + '_Tile_SVG').cloneNode(true);
+                tileSvg = getElementByID(maps.element.id + '_Tile_SVG').cloneNode(true);
                 svgDataElement = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">' +
                     svgObject.outerHTML + tileSvg.outerHTML + '</svg>';
             }
@@ -63,7 +61,7 @@ var ImageExport = /** @class */ (function () {
             else {
                 var image_1 = new Image();
                 var ctxt_1 = imageCanvasElement.getContext('2d');
-                if (!_this.control.isTileMap) {
+                if (!maps.isTileMap) {
                     image_1.onload = (function () {
                         ctxt_1.drawImage(image_1, 0, 0);
                         window.URL.revokeObjectURL(url);
@@ -82,22 +80,22 @@ var ImageExport = /** @class */ (function () {
                     image_1.src = url;
                 }
                 else {
-                    var svgParentElement = document.getElementById(_this.control.element.id + '_MapAreaBorder');
+                    var svgParentElement = document.getElementById(maps.element.id + '_MapAreaBorder');
                     var top_1 = parseFloat(svgParentElement.getAttribute('y'));
                     var left_1 = parseFloat(svgParentElement.getAttribute('x'));
                     var imgxHttp = new XMLHttpRequest();
-                    var imgTileLength_1 = _this.control.mapLayerPanel.tiles.length;
+                    var imgTileLength_1 = maps.mapLayerPanel.tiles.length;
                     var _loop_1 = function (i) {
-                        var tile = document.getElementById(_this.control.element.id + '_tile_' + (i - 1));
+                        var tile = document.getElementById(maps.element.id + '_tile_' + (i - 1));
                         var exportTileImg = new Image();
                         exportTileImg.crossOrigin = 'Anonymous';
-                        ctxt_1.fillStyle = _this.control.background ? _this.control.background : '#FFFFFF';
-                        ctxt_1.fillRect(0, 0, _this.control.availableSize.width, _this.control.availableSize.height);
-                        ctxt_1.font = _this.control.titleSettings.textStyle.size + ' Arial';
-                        var titleElement = document.getElementById(_this.control.element.id + '_Map_title');
+                        ctxt_1.fillStyle = maps.background ? maps.background : '#FFFFFF';
+                        ctxt_1.fillRect(0, 0, maps.availableSize.width, maps.availableSize.height);
+                        ctxt_1.font = maps.titleSettings.textStyle.size + ' Arial';
+                        var titleElement = document.getElementById(maps.element.id + '_Map_title');
                         if (!isNullOrUndefined(titleElement)) {
                             ctxt_1.fillStyle = titleElement.getAttribute('fill');
-                            ctxt_1.fillText(_this.control.titleSettings.text, parseFloat(titleElement.getAttribute('x')), parseFloat(titleElement.getAttribute('y')));
+                            ctxt_1.fillText(maps.titleSettings.text, parseFloat(titleElement.getAttribute('x')), parseFloat(titleElement.getAttribute('y')));
                         }
                         exportTileImg.onload = (function () {
                             if (i === 0 || i === imgTileLength_1 + 1) {
@@ -111,7 +109,6 @@ var ImageExport = /** @class */ (function () {
                                 }
                             }
                             else {
-                                var tileParent = document.getElementById(_this.control.element.id + '_tile_parent');
                                 ctxt_1.setTransform(1, 0, 0, 1, parseFloat(tile.style.left) + left_1, parseFloat(tile.style.top) +
                                     top_1);
                             }
@@ -168,15 +165,10 @@ var ImageExport = /** @class */ (function () {
     /**
      * To destroy the ImageExport.
      *
-     * @param {Maps} maps - Specifies the instance of the maps.
      * @returns {void}
      * @private
      */
-    ImageExport.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
-    };
+    ImageExport.prototype.destroy = function () { };
     return ImageExport;
 }());
 export { ImageExport };

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

@@ -7,13 +7,12 @@ import { PdfPageOrientation } from '@syncfusion/ej2-pdf-export';
  * @hidden
  */
 export declare class PdfExport {
-    private control;
     /**
      * Constructor for Maps
      *
      * @param {Maps} control Specifies the instance of the map
      */
-    constructor(control: Maps);
+    constructor();
     /**
      * To export the file as image/svg format
      *
@@ -24,7 +23,7 @@ export declare class PdfExport {
      * @returns {Promise<string>} - Returns the promise string
      * @private
      */
-    export(type: ExportType, fileName: string, allowDownload?: boolean, orientation?: PdfPageOrientation): Promise<string>;
+    export(maps: Maps, type: ExportType, fileName: string, allowDownload?: boolean, orientation?: PdfPageOrientation): Promise<string>;
     /**
      * Get module name.
      *
@@ -32,11 +31,10 @@ export declare class PdfExport {
      */
     protected getModuleName(): string;
     /**
-     * To destroy the PdfExports.
+     * To destroy the PdfExport.
      *
-     * @param {Maps} maps - Specifies the instance of the maps.
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }

package/src/maps/model/export-pdf.js

@@ -12,8 +12,7 @@ var PdfExport = /** @class */ (function () {
      *
      * @param {Maps} control Specifies the instance of the map
      */
-    function PdfExport(control) {
-        this.control = control;
+    function PdfExport() {
     }
     /**
      * To export the file as image/svg format
@@ -25,25 +24,24 @@ var PdfExport = /** @class */ (function () {
      * @returns {Promise<string>} - Returns the promise string
      * @private
      */
-    PdfExport.prototype.export = function (type, fileName, allowDownload, orientation) {
-        var _this = this;
+    PdfExport.prototype.export = function (maps, type, fileName, allowDownload, orientation) {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var promise = new Promise(function (resolve, reject) {
             var canvasElement = createElement('canvas', {
                 id: 'ej2-canvas',
                 attrs: {
-                    'width': _this.control.availableSize.width.toString(),
-                    'height': _this.control.availableSize.height.toString()
+                    'width': maps.availableSize.width.toString(),
+                    'height': maps.availableSize.height.toString()
                 }
             });
             orientation = isNullOrUndefined(orientation) ? PdfPageOrientation.Landscape : orientation;
-            var svgParent = document.getElementById(_this.control.element.id + '_Tile_SVG_Parent');
+            var svgParent = document.getElementById(maps.element.id + '_Tile_SVG_Parent');
             var svgData;
-            var exportElement = _this.control.svgObject.cloneNode(true);
+            var exportElement = maps.svgObject.cloneNode(true);
             var backgroundElement = exportElement.childNodes[0];
             var backgroundColor = backgroundElement.getAttribute('fill');
-            if ((_this.control.theme === 'Tailwind' || _this.control.theme === 'TailwindDark' || _this.control.theme === 'Bootstrap5' || _this.control.theme === 'Bootstrap5Dark'
-                || _this.control.theme === 'Fluent' || _this.control.theme === 'FluentDark') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
+            if ((maps.theme === 'Tailwind' || maps.theme === 'TailwindDark' || maps.theme === 'Bootstrap5' || maps.theme === 'Bootstrap5Dark'
+                || maps.theme === 'Fluent' || maps.theme === 'FluentDark') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
                 exportElement.childNodes[0].setAttribute('fill', 'rgba(255,255,255, 1)');
             }
             var url = window.URL.createObjectURL(new Blob(type === 'SVG' ? [svgData] :
@@ -51,7 +49,7 @@ var PdfExport = /** @class */ (function () {
             var pdfDocument = new PdfDocument();
             var image = new Image();
             var ctx = canvasElement.getContext('2d');
-            if (!_this.control.isTileMap) {
+            if (!maps.isTileMap) {
                 image.onload = (function () {
                     ctx.drawImage(image, 0, 0);
                     window.URL.revokeObjectURL(url);
@@ -59,7 +57,7 @@ var PdfExport = /** @class */ (function () {
                         var imageString = canvasElement.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');
                         pdfDocument.pageSettings.orientation = orientation;
                         imageString = imageString.slice(imageString.indexOf(',') + 1);
-                        pdfDocument.pages.add().graphics.drawImage(new PdfBitmap(imageString), 0, 0, (_this.control.availableSize.width - 60), _this.control.availableSize.height);
+                        pdfDocument.pages.add().graphics.drawImage(new PdfBitmap(imageString), 0, 0, (maps.availableSize.width - 60), maps.availableSize.height);
                         if (allowDownload) {
                             pdfDocument.save(fileName + '.pdf');
                             pdfDocument.destroy();
@@ -72,22 +70,22 @@ var PdfExport = /** @class */ (function () {
                 image.src = url;
             }
             else {
-                var svgParentElement = document.getElementById(_this.control.element.id + '_MapAreaBorder');
+                var svgParentElement = document.getElementById(maps.element.id + '_MapAreaBorder');
                 var top_1 = parseFloat(svgParentElement.getAttribute('y'));
                 var left_1 = parseFloat(svgParentElement.getAttribute('x'));
                 var xHttp = new XMLHttpRequest();
-                var tileLength_1 = _this.control.mapLayerPanel.tiles.length;
+                var tileLength_1 = maps.mapLayerPanel.tiles.length;
                 var _loop_1 = function (i) {
-                    var tile = document.getElementById(_this.control.element.id + '_tile_' + (i - 1));
+                    var tile = document.getElementById(maps.element.id + '_tile_' + (i - 1));
                     var tileImg = new Image();
                     tileImg.crossOrigin = 'Anonymous';
-                    ctx.fillStyle = _this.control.background ? _this.control.background : '#FFFFFF';
-                    ctx.fillRect(0, 0, _this.control.availableSize.width, _this.control.availableSize.height);
-                    ctx.font = _this.control.titleSettings.textStyle.size + ' Arial';
-                    var titleElement = document.getElementById(_this.control.element.id + '_Map_title');
+                    ctx.fillStyle = maps.background ? maps.background : '#FFFFFF';
+                    ctx.fillRect(0, 0, maps.availableSize.width, maps.availableSize.height);
+                    ctx.font = maps.titleSettings.textStyle.size + ' Arial';
+                    var titleElement = document.getElementById(maps.element.id + '_Map_title');
                     if (!isNullOrUndefined(titleElement)) {
                         ctx.fillStyle = titleElement.getAttribute('fill');
-                        ctx.fillText(_this.control.titleSettings.text, parseFloat(titleElement.getAttribute('x')), parseFloat(titleElement.getAttribute('y')));
+                        ctx.fillText(maps.titleSettings.text, parseFloat(titleElement.getAttribute('x')), parseFloat(titleElement.getAttribute('y')));
                     }
                     tileImg.onload = (function () {
                         if (i === 0 || i === tileLength_1 + 1) {
@@ -101,7 +99,6 @@ var PdfExport = /** @class */ (function () {
                             }
                         }
                         else {
-                            var tileParent = document.getElementById(_this.control.element.id + '_tile_parent');
                             ctx.setTransform(1, 0, 0, 1, parseFloat(tile.style.left) + left_1, parseFloat(tile.style.top) + top_1);
                         }
                         ctx.drawImage(tileImg, 0, 0);
@@ -111,7 +108,7 @@ var PdfExport = /** @class */ (function () {
                                 var x = localStorage.getItem('saved-image-example');
                                 pdfDocument.pageSettings.orientation = orientation;
                                 x = x.slice(x.indexOf(',') + 1);
-                                pdfDocument.pages.add().graphics.drawImage(new PdfBitmap(x), 0, 0, (_this.control.availableSize.width - 60), _this.control.availableSize.height);
+                                pdfDocument.pages.add().graphics.drawImage(new PdfBitmap(x), 0, 0, (maps.availableSize.width - 60), maps.availableSize.height);
                                 if (allowDownload) {
                                     pdfDocument.save(fileName + '.pdf');
                                     pdfDocument.destroy();
@@ -128,7 +125,7 @@ var PdfExport = /** @class */ (function () {
                         }
                         else {
                             setTimeout(function () {
-                                var tileSvg = document.getElementById(_this.control.element.id + '_Tile_SVG');
+                                var tileSvg = document.getElementById(maps.element.id + '_Tile_SVG');
                                 tileImg.src = window.URL.createObjectURL(new Blob([(new XMLSerializer()).serializeToString(tileSvg)], { type: 'image/svg+xml' }));
                             }, 300);
                         }
@@ -155,17 +152,12 @@ var PdfExport = /** @class */ (function () {
         return 'PdfExport';
     };
     /**
-     * To destroy the PdfExports.
+     * To destroy the PdfExport.
      *
-     * @param {Maps} maps - Specifies the instance of the maps.
      * @returns {void}
      * @private
      */
-    PdfExport.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
-    };
+    PdfExport.prototype.destroy = function () { };
     return PdfExport;
 }());
 export { PdfExport };

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

@@ -503,6 +503,14 @@ export interface ILabelRenderingEventArgs extends IMapsEventArgs {
      * Defines the text for the data-label in event argument.
      */
     text: string;
+    /**
+     * Defines the right and left position of text for the data-label in event argument.
+     */
+    offsetX: number;
+    /**
+    * Defines the top and bottom position of text for the data-label in event argument.
+    */
+    offsetY: number;
     /**
      * Defines the color and width of the border for the data-label in event argument.
      */

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

@@ -5,8 +5,6 @@ import { Maps } from '../../index';
  * @hidden
  */
 export declare class Print {
-    private control;
-    private printWindow;
     /**
      * Constructor for Maps
      *
@@ -20,7 +18,7 @@ export declare class Print {
      * @returns {void}
      * @private
      */
-    print(elements?: string[] | string | Element): void;
+    print(maps: Maps, elements?: string[] | string | Element): void;
     /**
      * To get the html string of the Maps
      *
@@ -38,9 +36,8 @@ export declare class Print {
     /**
      * To destroy the print.
      *
-     * @param {Maps} maps - Specifies the instance of the maps
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }

package/src/maps/model/print.js

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { print as printWindow, createElement } from '@syncfusion/ej2-base';
-import { getElement, getClientElement } from '../utils/helper';
+import { print as printFunction, createElement } from '@syncfusion/ej2-base';
+import { getElement } from '../utils/helper';
 import { beforePrint } from '../model/constants';
 /**
  * This module enables the print functionality in maps.
@@ -14,7 +14,6 @@ var Print = /** @class */ (function () {
      * @param {Maps} control - Specifies the instance of the map
      */
     function Print(control) {
-        this.control = control;
     }
     /**
      * To print the Maps
@@ -23,17 +22,16 @@ var Print = /** @class */ (function () {
      * @returns {void}
      * @private
      */
-    Print.prototype.print = function (elements) {
-        var _this = this;
-        this.printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');
-        this.printWindow.moveTo(0, 0);
-        this.printWindow.resizeTo(screen.availWidth, screen.availHeight);
+    Print.prototype.print = function (maps, elements) {
+        var printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');
+        printWindow.moveTo(0, 0);
+        printWindow.resizeTo(screen.availWidth, screen.availHeight);
         var argsData = {
-            cancel: false, htmlContent: this.getHTMLContent(elements), name: beforePrint
+            cancel: false, htmlContent: this.getHTMLContent(maps, elements), name: beforePrint
         };
-        this.control.trigger('beforePrint', argsData, function (beforePrintArgs) {
+        maps.trigger('beforePrint', argsData, function (beforePrintArgs) {
             if (!argsData.cancel) {
-                printWindow(argsData.htmlContent, _this.printWindow);
+                printFunction(argsData.htmlContent, printWindow);
             }
         });
     };
@@ -44,20 +42,19 @@ var Print = /** @class */ (function () {
      * @returns {Element} - Returns the div element
      * @private
      */
-    Print.prototype.getHTMLContent = function (elements) {
-        var elementRect = getClientElement(this.control.element.id);
+    Print.prototype.getHTMLContent = function (maps, elements) {
         var div = createElement('div');
-        var divElement = this.control.element.cloneNode(true);
-        if (this.control.isTileMap) {
+        var divElement = maps.element.cloneNode(true);
+        if (maps.isTileMap) {
             for (var i = 0; i < divElement.childElementCount; i++) {
-                if (divElement.children[i].id === this.control.element.id + '_tile_parent') {
+                if (divElement.children[i].id === maps.element.id + '_tile_parent') {
                     divElement.children[i].style.removeProperty('height');
                     divElement.children[i].style.removeProperty('width');
                     divElement.children[i].style.removeProperty('top');
                     divElement.children[i].style.removeProperty('left');
                     divElement.children[i].style.removeProperty('right');
                     divElement.children[i].style.removeProperty('overflow');
-                    var svgElement = document.getElementById(this.control.element.id + '_Tile_SVG_Parent');
+                    var svgElement = document.getElementById(maps.element.id + '_Tile_SVG_Parent');
                     divElement.children[i].children[0].style.overflow = 'hidden';
                     divElement.children[i].children[0].style.position = 'absolute';
                     divElement.children[i].children[0].style.height = svgElement.style.height;
@@ -97,15 +94,10 @@ var Print = /** @class */ (function () {
     /**
      * To destroy the print.
      *
-     * @param {Maps} maps - Specifies the instance of the maps
      * @returns {void}
      * @private
      */
-    Print.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
-    };
+    Print.prototype.destroy = function () { };
     return Print;
 }());
 export { Print };

package/src/maps/user-interaction/annotation.d.ts

@@ -14,9 +14,8 @@ export declare class Annotations {
     /**
      * To destroy the annotation.
      *
-     * @param {Maps} map - Specifies the instance of the maps
      * @returns {void}
      * @private
      */
-    destroy(map: Maps): void;
+    destroy(): void;
 }

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

@@ -113,12 +113,11 @@ var Annotations = /** @class */ (function () {
     /**
      * To destroy the annotation.
      *
-     * @param {Maps} map - Specifies the instance of the maps
      * @returns {void}
      * @private
      */
-    Annotations.prototype.destroy = function (map) {
-        // Destroy method performed here
+    Annotations.prototype.destroy = function () {
+        this.map = null;
     };
     return Annotations;
 }());

package/src/maps/user-interaction/highlight.d.ts

@@ -42,9 +42,8 @@ export declare class Highlight {
     /**
      * To destroy the highlight.
      *
-     * @param {Maps} maps - Specifies the maps instance
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }