@syncfusion/ej2-maps 19.4.53 → 19.4.56-105067

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

@@ -1333,18 +1333,21 @@ export declare class LayerSettings extends ChildProperty<LayerSettings> {
      * Sets and gets the Bing map type for the layer. If you use shape data with BingMapType without using layer type as Bing,
      * then the map will render based on shape data since default layer type will be set as Geometry.
      *
+     * @deprecated
      * @default Aerial
      */
     bingMapType: BingMapType;
     /**
      * Sets and gets the type of the static maps.
      *
+     * @deprecated
      * @default RoadMap
      */
     staticMapType: StaticMapType;
     /**
      * Sets and gets the key for the tile map layer in maps.
      *
+     * @deprecated
      * @default ''
      */
     key: string;
@@ -1352,13 +1355,14 @@ export declare class LayerSettings extends ChildProperty<LayerSettings> {
      * Sets and gets the type of the layer in maps. If we use layer type with shape data property in layer of the maps
      * then map will render based on the provided layer type.
      *
+     * @deprecated
      * @default Geometry
      */
     layerType: ShapeLayerType;
     /**
      * Sets and gets the template for the map using the url.
      *
-     * @default 'https://a.tile.openstreetmap.org/level/tileX/tileY.png'
+     * @default ''
      */
     urlTemplate: string;
     /**

package/src/maps/model/base.js

@@ -1,22 +1,22 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    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;
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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 */
 /**
  * Maps base document
@@ -525,7 +525,7 @@ var SubTitleSettings = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     __decorate([
-        Complex({ size: Theme.mapsSubTitleFont.size, fontWeight: null }, Font)
+        Complex({ size: null, fontWeight: null, fontFamily: null }, Font)
     ], SubTitleSettings.prototype, "textStyle", void 0);
     __decorate([
         Property('Center')
@@ -542,7 +542,7 @@ var TitleSettings = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     __decorate([
-        Complex({ size: Theme.mapsTitleFont.size, fontWeight: null }, Font)
+        Complex({ size: null, fontWeight: null, fontFamily: null }, Font)
     ], TitleSettings.prototype, "textStyle", void 0);
     __decorate([
         Property('Center')
@@ -689,7 +689,7 @@ var LegendSettings = /** @class */ (function (_super) {
         Property('')
     ], LegendSettings.prototype, "height", void 0);
     __decorate([
-        Complex({}, Font)
+        Complex({ fontFamily: null }, Font)
     ], LegendSettings.prototype, "textStyle", void 0);
     __decorate([
         Property(15)
@@ -710,7 +710,7 @@ var LegendSettings = /** @class */ (function (_super) {
         Complex({}, CommonTitleSettings)
     ], LegendSettings.prototype, "title", void 0);
     __decorate([
-        Complex(Theme.legendTitleFont, Font)
+        Complex({ size: Theme.legendTitleFont.size, color: Theme.legendTitleFont.color, fontStyle: Theme.legendTitleFont.fontStyle, fontWeight: Theme.legendTitleFont.fontWeight, fontFamily: null }, Font)
     ], LegendSettings.prototype, "titleStyle", void 0);
     __decorate([
         Property('Bottom')
@@ -978,7 +978,7 @@ var LayerSettings = /** @class */ (function (_super) {
         Property('Geometry')
     ], LayerSettings.prototype, "layerType", void 0);
     __decorate([
-        Property('https://a.tile.openstreetmap.org/level/tileX/tileY.png')
+        Property('')
     ], LayerSettings.prototype, "urlTemplate", void 0);
     __decorate([
         Property(true)

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

@@ -19,6 +19,12 @@ export declare const loaded: string;
  * @private
  */
 export declare const click: string;
+/**
+ * Specifies the maps onclick event name.
+ *
+ * @private
+ */
+export declare const onclick: string;
 /**
  * Specifies the maps right click event name.
  *

package/src/maps/model/constants.js

@@ -19,6 +19,12 @@ export var loaded = 'loaded';
  * @private
  */
 export var click = 'click';
+/**
+ * Specifies the maps onclick event name.
+ *
+ * @private
+ */
+export var onclick = 'onclick';
 /**
  * Specifies the maps right click event name.
  *

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

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { createElement, Browser } from '@syncfusion/ej2-base';
-import { triggerDownload } from '../utils/helper';
+import { createElement, Browser, isNullOrUndefined } from '@syncfusion/ej2-base';
+import { triggerDownload, getElementByID } from '../utils/helper';
 /**
  * This module enables the export to Image functionality in Maps control.
  *
@@ -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,32 +23,33 @@ 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;
-            if (!_this.control.isTileMap) {
+            var tileSvg;
+            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 {
-                var tileSvg = document.getElementById(_this.control.element.id + '_Tile_SVG');
+                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">' +
-                    _this.control.svgObject.outerHTML + tileSvg.outerHTML + '</svg>';
+                    svgObject.outerHTML + tileSvg.outerHTML + '</svg>';
             }
             var url = window.URL.createObjectURL(new Blob(type === 'SVG' ? [svgDataElement] :
-                [(new XMLSerializer()).serializeToString(_this.control.svgObject)], { type: 'image/svg+xml' }));
+                [(new XMLSerializer()).serializeToString(svgObject)], { type: 'image/svg+xml' }));
             if (type === 'SVG') {
                 if (allowDownload) {
                     triggerDownload(fileName, type, url, isDownload);
@@ -61,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);
@@ -80,31 +80,37 @@ var ImageExport = /** @class */ (function () {
                     image_1.src = url;
                 }
                 else {
+                    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';
-                        ctxt_1.fillStyle = document.getElementById(_this.control.element.id + '_Map_title').getAttribute('fill');
-                        ctxt_1.fillText(_this.control.titleSettings.text, parseFloat(document.getElementById(_this.control.element.id + '_Map_title').getAttribute('x')), parseFloat(document.getElementById(_this.control.element.id + '_Map_title').getAttribute('y')));
+                        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(maps.titleSettings.text, parseFloat(titleElement.getAttribute('x')), parseFloat(titleElement.getAttribute('y')));
+                        }
                         exportTileImg.onload = (function () {
                             if (i === 0 || i === imgTileLength_1 + 1) {
                                 if (i === 0) {
                                     ctxt_1.setTransform(1, 0, 0, 1, 0, 0);
-                                    ctxt_1.rect(0, parseFloat(svgParent.style.top), parseFloat(svgParent.style.width), parseFloat(svgParent.style.height));
+                                    ctxt_1.rect(0, top_1, parseFloat(svgParent.style.width), parseFloat(svgParent.style.height));
                                     ctxt_1.clip();
                                 }
                                 else {
-                                    ctxt_1.setTransform(1, 0, 0, 1, parseFloat(svgParent.style.left), parseFloat(svgParent.style.top));
+                                    ctxt_1.setTransform(1, 0, 0, 1, left_1, top_1);
                                 }
                             }
                             else {
-                                ctxt_1.setTransform(1, 0, 0, 1, parseFloat(tile.style.left) + 10, parseFloat(tile.style.top) +
-                                    (parseFloat(document.getElementById(_this.control.element.id + '_tile_parent').style.top)));
+                                ctxt_1.setTransform(1, 0, 0, 1, parseFloat(tile.style.left) + left_1, parseFloat(tile.style.top) +
+                                    top_1);
                             }
                             ctxt_1.drawImage(exportTileImg, 0, 0);
                             if (i === imgTileLength_1 + 1) {
@@ -130,7 +136,7 @@ var ImageExport = /** @class */ (function () {
                             }
                             else {
                                 setTimeout(function () {
-                                    exportTileImg.src = window.URL.createObjectURL(new Blob([(new XMLSerializer()).serializeToString(document.getElementById(_this.control.element.id + '_Tile_SVG'))], { type: 'image/svg+xml' }));
+                                    exportTileImg.src = window.URL.createObjectURL(new Blob([(new XMLSerializer()).serializeToString(tileSvg)], { type: 'image/svg+xml' }));
                                 }, 300);
                             }
                         }
@@ -159,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')
-                && (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,31 +70,36 @@ var PdfExport = /** @class */ (function () {
                 image.src = url;
             }
             else {
+                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';
-                    ctx.fillStyle = document.getElementById(_this.control.element.id + '_Map_title').getAttribute('fill');
-                    ctx.fillText(_this.control.titleSettings.text, parseFloat(document.getElementById(_this.control.element.id + '_Map_title').getAttribute('x')), parseFloat(document.getElementById(_this.control.element.id + '_Map_title').getAttribute('y')));
+                    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(maps.titleSettings.text, parseFloat(titleElement.getAttribute('x')), parseFloat(titleElement.getAttribute('y')));
+                    }
                     tileImg.onload = (function () {
                         if (i === 0 || i === tileLength_1 + 1) {
                             if (i === 0) {
                                 ctx.setTransform(1, 0, 0, 1, 0, 0);
-                                ctx.rect(0, parseFloat(svgParent.style.top), parseFloat(svgParent.style.width), parseFloat(svgParent.style.height));
+                                ctx.rect(0, top_1, parseFloat(svgParent.style.width), parseFloat(svgParent.style.height));
                                 ctx.clip();
                             }
                             else {
-                                ctx.setTransform(1, 0, 0, 1, parseFloat(svgParent.style.left), parseFloat(svgParent.style.top));
+                                ctx.setTransform(1, 0, 0, 1, left_1, top_1);
                             }
                         }
                         else {
-                            ctx.setTransform(1, 0, 0, 1, parseFloat(tile.style.left) + 10, parseFloat(tile.style.top) +
-                                (parseFloat(document.getElementById(_this.control.element.id + '_tile_parent').style.top)));
+                            ctx.setTransform(1, 0, 0, 1, parseFloat(tile.style.left) + left_1, parseFloat(tile.style.top) + top_1);
                         }
                         ctx.drawImage(tileImg, 0, 0);
                         if (i === tileLength_1 + 1) {
@@ -105,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();
@@ -122,7 +125,8 @@ var PdfExport = /** @class */ (function () {
                         }
                         else {
                             setTimeout(function () {
-                                tileImg.src = window.URL.createObjectURL(new Blob([(new XMLSerializer()).serializeToString(document.getElementById(_this.control.element.id + '_Tile_SVG'))], { type: 'image/svg+xml' }));
+                                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);
                         }
                     }
@@ -148,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 };