@syncfusion/ej2-maps 25.2.4 → 25.2.5

package/src/maps/layers/marker.d.ts

@@ -31,7 +31,7 @@ export declare class Marker {
      */
     private calculateIndividualLayerMarkerZoomLevel;
     /**
-     * To calculate center position and factor value dynamically
+     * To calculate center position and factor value dynamically.
      *
      * @param {LayerSettings[]} layersCollection - Specifies the layer settings instance.
      * @returns {void}
@@ -39,7 +39,7 @@ export declare class Marker {
      */
     calculateZoomCenterPositionAndFactor(layersCollection: LayerSettings[]): void;
     /**
-     * To check and trigger marker click event
+     * To check and trigger marker click event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -47,7 +47,7 @@ export declare class Marker {
      */
     markerClick(e: PointerEvent): void;
     /**
-     * To check and trigger Cluster click event
+     * To check and trigger Cluster click event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -55,14 +55,14 @@ export declare class Marker {
      */
     markerClusterClick(e: PointerEvent): void;
     /**
-     * To get marker from target id
+     * To get marker from target id.
      *
      * @param {string} target - Specifies the target
      * @returns {object} - Returns the marker, data, clusterCollection, markCollection
      */
     private getMarker;
     /**
-     * To check and trigger marker move event
+     * To check and trigger marker move event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -70,15 +70,15 @@ export declare class Marker {
      */
     markerMove(e: PointerEvent): void;
     /**
-     * To check and trigger cluster move event
+     * To check and trigger cluster move event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
      * @private
      */
     markerClusterMouseMove(e: PointerEvent): void;
-    /** @private
-     *
+    /**
+     * @private
      * @returns {void}
      */
     initializeMarkerClusterList(): void;

package/src/maps/layers/marker.js

@@ -159,7 +159,7 @@ var Marker = /** @class */ (function () {
         return scaleFactor;
     };
     /**
-     * To calculate center position and factor value dynamically
+     * To calculate center position and factor value dynamically.
      *
      * @param {LayerSettings[]} layersCollection - Specifies the layer settings instance.
      * @returns {void}
@@ -288,7 +288,7 @@ var Marker = /** @class */ (function () {
         }
     };
     /**
-     * To check and trigger marker click event
+     * To check and trigger marker click event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -350,7 +350,7 @@ var Marker = /** @class */ (function () {
         }
     };
     /**
-     * To check and trigger Cluster click event
+     * To check and trigger Cluster click event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -389,7 +389,7 @@ var Marker = /** @class */ (function () {
         this.maps.trigger(markerClusterClick, eventArgs);
     };
     /**
-     * To get marker from target id
+     * To get marker from target id.
      *
      * @param {string} target - Specifies the target
      * @returns {object} - Returns the marker, data, clusterCollection, markCollection
@@ -445,7 +445,7 @@ var Marker = /** @class */ (function () {
         return null;
     };
     /**
-     * To check and trigger marker move event
+     * To check and trigger marker move event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -471,7 +471,7 @@ var Marker = /** @class */ (function () {
         this.maps.trigger(markerMouseMove, eventArgs);
     };
     /**
-     * To check and trigger cluster move event
+     * To check and trigger cluster move event.
      *
      * @param {PointerEvent} e - Specifies the pointer event argument.
      * @returns {void}
@@ -495,8 +495,8 @@ var Marker = /** @class */ (function () {
         };
         this.maps.trigger(markerClusterMouseMove, eventArgs);
     };
-    /** @private
-     *
+    /**
+     * @private
      * @returns {void}
      */
     Marker.prototype.initializeMarkerClusterList = function () {

package/src/maps/layers/navigation-selected-line.d.ts

@@ -7,7 +7,7 @@ export declare class NavigationLine {
     private maps;
     constructor(maps: Maps);
     /**
-     * To render navigation line for maps
+     * 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.

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

@@ -9,7 +9,7 @@ var NavigationLine = /** @class */ (function () {
         this.maps = maps;
     }
     /**
-     * To render navigation line for maps
+     * 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.

package/src/maps/layers/polygon.d.ts

@@ -5,7 +5,7 @@ import { Maps } from '../../index';
 export declare class Polygon {
     constructor(maps: Maps);
     /**
-     * To render polygon for maps
+     * To render polygon for maps.
      *
      * @param {Maps} maps - Specifies the layer instance to which the polygon is to be rendered.
      * @param {number} layerIndex -Specifies the index of current layer.

package/src/maps/layers/polygon.js

@@ -10,7 +10,7 @@ var Polygon = /** @class */ (function () {
     /* eslint-enable @typescript-eslint/no-unused-vars */
     /* eslint-enable @typescript-eslint/no-empty-function */
     /**
-     * To render polygon for maps
+     * To render polygon for maps.
      *
      * @param {Maps} maps - Specifies the layer instance to which the polygon is to be rendered.
      * @param {number} layerIndex -Specifies the index of current layer.

package/src/maps/maps.d.ts

@@ -519,7 +519,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      */
     intl: Internationalization;
     /**
-     * Check layer whether is geometry or tile
+     * Check layer whether is geometry or tile.
      *
      * @private
      */
@@ -709,7 +709,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
     /** @private */
     toggledLegendId: number[];
     /** @private */
-    toggledShapeElementId: string[];
+    toggledElementId: string[];
     /** @private */
     checkInitialRender: boolean;
     /** @private */
@@ -745,14 +745,14 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
     /** @private */
     markerDragArgument: any;
     /**
-     * Constructor for creating the widget
+     * Constructor for creating the widget.
      *
      * @param {MapsModel} options Specifies the options
      * @param {string | HTMLElement} element Specifies the element
      */
     constructor(options?: MapsModel, element?: string | HTMLElement);
     /**
-     * To manage persist maps data
+     * To manage persist maps data.
      *
      * @returns {void}
      */
@@ -794,7 +794,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
     private renderMap;
     private triggerZoomEvent;
     /**
-     * To apply color to the initial selected marker
+     * To apply color to the initial selected marker.
      *
      * @param {SelectionSettingsModel} selectionSettings - Specifies the selection settings
      * @param {Maps} map - Specifies the instance of the maps
@@ -805,7 +805,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      */
     markerSelection(selectionSettings: SelectionSettingsModel, map: Maps, targetElement: Element, data: object): void;
     /**
-     * initial selection of marker
+     * initial selection of marker.
      *
      * @param {number} layerIndex - Specifies the layer index
      * @param {number} markerIndex - Specifies the marker index
@@ -817,13 +817,13 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      */
     markerInitialSelection(layerIndex: number, markerIndex: number, markerSettings: MarkerSettingsModel, latitude: number, longitude: number): void;
     /**
-     * Render the map area border
+     * Render the map area border.
      *
      * @returns {void}
      */
     private renderArea;
     /**
-     * To add tab index for map element
+     * To add tab index for map element.
      *
      * @returns {void}
      */
@@ -849,14 +849,14 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
     private initPrivateVariable;
     private findBaseAndSubLayers;
     /**
-     * Render the map border
+     * Render the map border.
      *
      * @private
      * @returns {void}
      */
     private renderBorder;
     /**
-     * Render the title and subtitle
+     * Render the title and subtitle.
      *
      * @param {TitleSettingsModel} title - Specifies the title
      * @param {string} type - Specifies the type
@@ -867,13 +867,13 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      */
     private renderTitle;
     /**
-     * To create svg element for maps
+     * To create svg element for maps.
      *
      * @returns {void}
      */
     private createSVG;
     /**
-     * To Remove the SVG
+     * To Remove the SVG.
      *
      * @returns {void}
      */
@@ -921,7 +921,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
     private triggerShapeSelection;
     private getMarkerClickLocation;
     /**
-     * Gets the location of the mouse click
+     * Gets the location of the mouse click.
      *
      * @param {string} targetId - Specifies the ID for the target.
      * @param {number} pageX - Defines the page X position.
@@ -930,10 +930,8 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      * @param  {number} x - Defines the x position in pixel.
      * @param {number} y - Defines the y position in pixel.
      * @param {string} type -  Specifies the type.
-     * @returns {GeoPosition} -  Returns the position of the event
-     *
+     * @returns {GeoPosition} -  Returns the position of the event.
      * @private
-     *
      */
     getClickLocation(targetId: string, pageX: number, pageY: number, targetElement: HTMLElement, x: number, y: number, type?: string): GeoPosition;
     private removeTileMap;
@@ -1017,7 +1015,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
     /**
      * This method is used to add the layers dynamically to the maps.
      *
-     * @param {Object} layer - Specifies the layer to be added in the maps.
+     * @param {object} layer - Specifies the layer to be added in the maps.
      * @returns {void}
      */
     addLayer(layer: Object): void;
@@ -1083,7 +1081,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      */
     destroy(): void;
     /**
-     * Gets component name
+     * Gets component name.
      *
      * @returns {string} - Returns the string value
      * @private
@@ -1106,44 +1104,44 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      */
     onPropertyChanged(newProp: MapsModel, oldProp: MapsModel): void;
     /**
-     * To provide the array of modules needed for maps rendering
+     * To provide the array of modules needed for maps rendering.
      *
      * @returns {ModuleDeclaration[]} - Returns the modules
      * @private
      */
     requiredModules(): ModuleDeclaration[];
     /**
-     * To find marker visibility
+     * To find marker visibility.
      *
      * @returns {boolean} - Returns whether the markers are visible or not.
      */
     private isMarkersVisible;
     /**
-     * To find DataLabel visibility
+     * To find DataLabel visibility.
      *
      * @returns {boolean} - Returns whether the data labels are visible or not.
      */
     private isDataLabelVisible;
     /**
-     * To find navigation line visibility
+     * To find navigation line visibility.
      *
      * @returns {boolean} - Returns whether the navigation lines are visible or not.
      */
     private isNavigationVisible;
     /**
-     * To find navigation line visibility
+     * To find navigation line visibility.
      *
      * @returns {boolean} - Returns whether the navigation lines are visible or not.
      */
     private isPolygonVisible;
     /**
-     * To find marker visibility
+     * To find marker visibility.
      *
      * @returns {boolean} - Returns whether the bubble is visible or not.
      */
     private isBubbleVisible;
     /**
-     * To find the bubble visibility from layer
+     * To find the bubble visibility from layer.
      *
      * @param {LayerSettingsModel} layer - Spcifies the layer settings model
      * @returns {boolean} - Returns the boolean value
@@ -1209,7 +1207,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      *
      * @param {number} pageX - Specifies the x position value in pixels.
      * @param {number} pageY - Specifies the y position value in pixels.
-     * @returns {Object} - Returns the latitude and longitude values.
+     * @returns {object} - Returns the latitude and longitude values.
      */
     pointToLatLong(pageX: number, pageY: number): Object;
 }

package/src/maps/maps.js

@@ -52,7 +52,7 @@ import { DataManager, Query } from '@syncfusion/ej2-data';
 var Maps = /** @class */ (function (_super) {
     __extends(Maps, _super);
     /**
-     * Constructor for creating the widget
+     * Constructor for creating the widget.
      *
      * @param {MapsModel} options Specifies the options
      * @param {string | HTMLElement} element Specifies the element
@@ -60,7 +60,7 @@ var Maps = /** @class */ (function (_super) {
     function Maps(options, element) {
         var _this = _super.call(this, options, element) || this;
         /**
-         * Check layer whether is geometry or tile
+         * Check layer whether is geometry or tile.
          *
          * @private
          */
@@ -132,7 +132,7 @@ var Maps = /** @class */ (function (_super) {
         /** @private */
         _this.toggledLegendId = [];
         /** @private */
-        _this.toggledShapeElementId = [];
+        _this.toggledElementId = [];
         /** @private */
         _this.checkInitialRender = true;
         /** @private */
@@ -174,7 +174,7 @@ var Maps = /** @class */ (function (_super) {
         configurable: true
     });
     /**
-     * To manage persist maps data
+     * To manage persist maps data.
      *
      * @returns {void}
      */
@@ -533,7 +533,7 @@ var Maps = /** @class */ (function (_super) {
         //eslint-enable @typescript-eslint/prefer-const
     };
     /**
-     * To apply color to the initial selected marker
+     * To apply color to the initial selected marker.
      *
      * @param {SelectionSettingsModel} selectionSettings - Specifies the selection settings
      * @param {Maps} map - Specifies the instance of the maps
@@ -575,7 +575,7 @@ var Maps = /** @class */ (function (_super) {
         }
     };
     /**
-     * initial selection of marker
+     * initial selection of marker.
      *
      * @param {number} layerIndex - Specifies the layer index
      * @param {number} markerIndex - Specifies the marker index
@@ -600,7 +600,7 @@ var Maps = /** @class */ (function (_super) {
         }
     };
     /**
-     * Render the map area border
+     * Render the map area border.
      *
      * @returns {void}
      */
@@ -617,7 +617,7 @@ var Maps = /** @class */ (function (_super) {
         }
     };
     /**
-     * To add tab index for map element
+     * To add tab index for map element.
      *
      * @returns {void}
      */
@@ -840,7 +840,7 @@ var Maps = /** @class */ (function (_super) {
         });
     };
     /**
-     * Render the map border
+     * Render the map border.
      *
      * @private
      * @returns {void}
@@ -861,7 +861,7 @@ var Maps = /** @class */ (function (_super) {
         }
     };
     /**
-     * Render the title and subtitle
+     * Render the title and subtitle.
      *
      * @param {TitleSettingsModel} title - Specifies the title
      * @param {string} type - Specifies the type
@@ -914,7 +914,7 @@ var Maps = /** @class */ (function (_super) {
         }
     };
     /**
-     * To create svg element for maps
+     * To create svg element for maps.
      *
      * @returns {void}
      */
@@ -923,7 +923,7 @@ var Maps = /** @class */ (function (_super) {
         createSvg(this);
     };
     /**
-     * To Remove the SVG
+     * To Remove the SVG.
      *
      * @returns {void}
      */
@@ -1214,7 +1214,7 @@ var Maps = /** @class */ (function (_super) {
         return latLongValue;
     };
     /**
-     * Gets the location of the mouse click
+     * Gets the location of the mouse click.
      *
      * @param {string} targetId - Specifies the ID for the target.
      * @param {number} pageX - Defines the page X position.
@@ -1223,10 +1223,8 @@ var Maps = /** @class */ (function (_super) {
      * @param  {number} x - Defines the x position in pixel.
      * @param {number} y - Defines the y position in pixel.
      * @param {string} type -  Specifies the type.
-     * @returns {GeoPosition} -  Returns the position of the event
-     *
+     * @returns {GeoPosition} -  Returns the position of the event.
      * @private
-     *
      */
     Maps.prototype.getClickLocation = function (targetId, pageX, pageY, targetElement, x, y, type) {
         var layerIndex = 0;
@@ -1298,7 +1296,7 @@ var Maps = /** @class */ (function (_super) {
                 }
             }
             else {
-                latLongValue = this.getGeoLocation(layerIndex, x, y);
+                latLongValue = this.getGeoLocation(layerIndex, pageX, pageY);
             }
         }
         else if (this.isTileMap && (!isNullOrUndefined(type) ||
@@ -1735,7 +1733,7 @@ var Maps = /** @class */ (function (_super) {
     /**
      * This method is used to add the layers dynamically to the maps.
      *
-     * @param {Object} layer - Specifies the layer to be added in the maps.
+     * @param {object} layer - Specifies the layer to be added in the maps.
      * @returns {void}
      */
     Maps.prototype.addLayer = function (layer) {
@@ -2018,7 +2016,7 @@ var Maps = /** @class */ (function (_super) {
         }
         _super.prototype.destroy.call(this);
         this.shapeSelectionItem = [];
-        this.toggledShapeElementId = [];
+        this.toggledElementId = [];
         this.toggledLegendId = [];
         this.legendSelectionCollection = [];
         this.selectedLegendElementId = [];
@@ -2079,7 +2077,7 @@ var Maps = /** @class */ (function (_super) {
         this.markerDragArgument = null;
     };
     /**
-     * Gets component name
+     * Gets component name.
      *
      * @returns {string} - Returns the string value
      * @private
@@ -2199,7 +2197,7 @@ var Maps = /** @class */ (function (_super) {
         }
     };
     /**
-     * To provide the array of modules needed for maps rendering
+     * To provide the array of modules needed for maps rendering.
      *
      * @returns {ModuleDeclaration[]} - Returns the modules
      * @private
@@ -2312,7 +2310,7 @@ var Maps = /** @class */ (function (_super) {
         return modules;
     };
     /**
-     * To find marker visibility
+     * To find marker visibility.
      *
      * @returns {boolean} - Returns whether the markers are visible or not.
      */
@@ -2329,7 +2327,7 @@ var Maps = /** @class */ (function (_super) {
         return isVisible;
     };
     /**
-     * To find DataLabel visibility
+     * To find DataLabel visibility.
      *
      * @returns {boolean} - Returns whether the data labels are visible or not.
      */
@@ -2344,7 +2342,7 @@ var Maps = /** @class */ (function (_super) {
         return isVisible;
     };
     /**
-     * To find navigation line visibility
+     * To find navigation line visibility.
      *
      * @returns {boolean} - Returns whether the navigation lines are visible or not.
      */
@@ -2361,7 +2359,7 @@ var Maps = /** @class */ (function (_super) {
         return isVisible;
     };
     /**
-     * To find navigation line visibility
+     * To find navigation line visibility.
      *
      * @returns {boolean} - Returns whether the navigation lines are visible or not.
      */
@@ -2378,7 +2376,7 @@ var Maps = /** @class */ (function (_super) {
         return isVisible;
     };
     /**
-     * To find marker visibility
+     * To find marker visibility.
      *
      * @returns {boolean} - Returns whether the bubble is visible or not.
      */
@@ -2394,7 +2392,7 @@ var Maps = /** @class */ (function (_super) {
         return isVisible;
     };
     /**
-     * To find the bubble visibility from layer
+     * To find the bubble visibility from layer.
      *
      * @param {LayerSettingsModel} layer - Spcifies the layer settings model
      * @returns {boolean} - Returns the boolean value
@@ -2569,8 +2567,12 @@ var Maps = /** @class */ (function (_super) {
         var longitude = 0;
         if (!this.isDestroyed) {
             var container = document.getElementById(this.element.id);
-            var pageX = x - (isNullOrUndefined(this.markerDragArgument) ? container.offsetLeft : 0);
-            var pageY = y - (isNullOrUndefined(this.markerDragArgument) ? container.offsetTop : 0);
+            var elementClientRect = this.element.getBoundingClientRect();
+            var bodyClientRect = document.body.getBoundingClientRect();
+            var pageX = x - (isNullOrUndefined(this.markerDragArgument) ? container.offsetLeft ||
+                (elementClientRect.left - bodyClientRect.left) : 0);
+            var pageY = y - (isNullOrUndefined(this.markerDragArgument) ? container.offsetTop ||
+                (elementClientRect.top - bodyClientRect.top) : 0);
             var currentLayer = this.layersCollection[layerIndex];
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             var translate = getTranslate(this, currentLayer, false);
@@ -2614,7 +2616,7 @@ var Maps = /** @class */ (function (_super) {
      *
      * @param {number} pageX - Specifies the x position value in pixels.
      * @param {number} pageY - Specifies the y position value in pixels.
-     * @returns {Object} - Returns the latitude and longitude values.
+     * @returns {object} - Returns the latitude and longitude values.
      */
     Maps.prototype.pointToLatLong = function (pageX, pageY) {
         var latitude = 0;

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

@@ -462,6 +462,14 @@ export interface TooltipSettingsModel {
      */
     valuePath?: string;
 
+    /**
+     * Specifies the value within which the tooltip will be removed on a mobile device. The value represents time in milliseconds.
+     * If the value is set to 0, the tooltip will not be removed. If the value is set to greater than 0, the tooltip will be removed at the specified time.
+     *
+     * @default 2000
+     */
+    duration?: number;
+
 }
 
 /**
@@ -493,6 +501,14 @@ export interface PolygonTooltipSettingsModel {
      */
     textStyle?: FontModel;
 
+    /**
+     * Specifies the value within which the tooltip will be removed on a mobile device. The value represents time in milliseconds.
+     * If the value is set to 0, the tooltip will not be removed. If the value is set to greater than 0, the tooltip will be removed at the specified time.
+     *
+     * @default 2000
+     */
+    duration?: number;
+
 }
 
 /**
@@ -1993,8 +2009,8 @@ export interface LayerSettingsModel {
 
     /**
      * Gets or sets the geometry type for the layer in maps. There are two types: Geographic and Normal.
-     * * Geographic type renders the shape maps with geographical coordinate system.
-     * * Normal type renders the shape maps using default coordinate system.
+     * - Geographic type renders the shape maps with geographical coordinate system.
+     * - Normal type renders the shape maps using default coordinate system.
      *
      * @default Geographic
      */