@syncfusion/ej2-maps 19.4.56 → 19.4.57-105067

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

@@ -1,6 +1,6 @@
 import { click, itemSelection } from '../index';
 import { getElement, createStyle, customizeStyle, removeClass, getTargetElement, getElementByID } from '../utils/helper';
-import { isNullOrUndefined, Browser } from '@syncfusion/ej2-base';
+import { isNullOrUndefined } from '@syncfusion/ej2-base';
 /**
  * Selection module class
  */
@@ -17,7 +17,6 @@ var Selection = /** @class */ (function () {
     Selection.prototype.addEventListener = function () {
         if (!this.maps.isDestroyed) {
             this.maps.on(click, this.mouseClick, this);
-            this.maps.on(Browser.touchEndEvent, this.mouseClick, this);
         }
     };
     /**
@@ -30,7 +29,6 @@ var Selection = /** @class */ (function () {
             return;
         }
         this.maps.off(click, this.mouseClick);
-        this.maps.off(Browser.touchEndEvent, this.mouseClick);
     };
     Selection.prototype.mouseClick = function (targetElement) {
         if (!isNullOrUndefined(targetElement['type']) && targetElement['type'].indexOf('touch') !== -1 &&
@@ -48,8 +46,12 @@ var Selection = /** @class */ (function () {
             var layerIndex = parseInt(targetElement.id.split('_LayerIndex_')[1].split('_')[0], 10);
             if (targetElement.id.indexOf('shapeIndex') > -1) {
                 shapeIndex = parseInt(targetElement.id.split('_shapeIndex_')[1].split('_')[0], 10);
-                shapeData = this.maps.layers[layerIndex].shapeData['features']['length'] > shapeIndex ?
-                    this.maps.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] : null;
+                shapeData = !isNullOrUndefined(this.maps.layers[layerIndex].shapeData['features'])
+                    && this.maps.layers[layerIndex].shapeData['features']['length'] > shapeIndex ?
+                    this.maps.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] :
+                    !isNullOrUndefined(this.maps.layers[layerIndex].shapeData['geometries'])
+                        && this.maps.layers[layerIndex].shapeData['geometries']['length'] > shapeIndex ?
+                        this.maps.layers[layerIndex].shapeData['geometries'][shapeIndex]['properties'] : null;
                 dataIndex = parseInt(targetElement.id.split('_dataIndex_')[1].split('_')[0], 10);
                 data = isNullOrUndefined(dataIndex) ? null : this.maps.layers[layerIndex].dataSource[dataIndex];
                 this.selectionsettings = this.maps.layers[layerIndex].selectionSettings;
@@ -133,15 +135,17 @@ var Selection = /** @class */ (function () {
         var parentElement;
         var children;
         var selectionClass;
+        var isLineStringShape = targetElement.parentElement.id.indexOf('LineString') > -1;
         var selectionsettings = this.selectionsettings;
         var border = {
-            color: (targetElement.parentElement.id.indexOf('LineString') === -1) ? this.selectionsettings.border.color : (this.selectionsettings.border.color || this.selectionsettings.fill),
-            width: (targetElement.parentElement.id.indexOf('LineString') === -1) ? (this.selectionsettings.border.width / (this.selectionType === 'Marker' ? 1 : this.maps.scale)) : (this.selectionsettings.border.width / this.maps.scale),
+            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
         };
         var eventArgs = {
             opacity: this.selectionsettings.opacity,
-            fill: (targetElement.parentElement.id.indexOf('LineString') === -1) ? (this.selectionType !== 'navigationline' ? this.selectionsettings.fill : 'none') : 'transparent',
+            fill: isLineStringShape ? 'transparent' : (this.selectionType !== 'navigationline' ? this.selectionsettings.fill : 'none'),
             border: border,
             name: itemSelection,
             target: targetElement.id,
@@ -153,7 +157,8 @@ var Selection = /** @class */ (function () {
         this.maps.trigger('itemSelection', eventArgs, function (observedArgs) {
             eventArgs.border.opacity = isNullOrUndefined(_this.selectionsettings.border.opacity) ? _this.selectionsettings.opacity : _this.selectionsettings.border.opacity;
             if (!eventArgs.cancel) {
-                if (targetElement.getAttribute('class') === _this.selectionType + 'selectionMapStyle') {
+                if (targetElement.getAttribute('class') === _this.selectionType + 'selectionMapStyle'
+                    || targetElement.getAttribute('class') === 'LineselectionMapStyle') {
                     removeClass(targetElement);
                     _this.removedSelectionList(targetElement);
                     for (var m = 0; m < _this.maps.shapeSelectionItem.length; m++) {
@@ -172,7 +177,8 @@ var Selection = /** @class */ (function () {
                 else {
                     var layetElement = getElementByID(_this.maps.element.id + '_Layer_Collections');
                     if (!_this.selectionsettings.enableMultiSelect &&
-                        layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle').length > 0) {
+                        (layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle').length > 0 ||
+                            layetElement.getElementsByClassName('LineselectionMapStyle').length > 0)) {
                         var eleCount = layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle').length;
                         var ele = void 0;
                         for (var k = 0; k < eleCount; k++) {
@@ -180,6 +186,14 @@ var Selection = /** @class */ (function () {
                             removeClass(ele);
                             _this.removedSelectionList(ele);
                         }
+                        if (layetElement.getElementsByClassName('LineselectionMapStyle').length > 0) {
+                            eleCount = layetElement.getElementsByClassName('LineselectionMapStyle').length;
+                            for (var k = 0; k < eleCount; k++) {
+                                ele = layetElement.getElementsByClassName('LineselectionMapStyle')[0];
+                                removeClass(ele);
+                                _this.removedSelectionList(ele);
+                            }
+                        }
                         if (_this.selectionType === 'Shape') {
                             _this.maps.shapeSelectionItem = [];
                             var selectionLength = _this.maps.selectedElementId.length;
@@ -197,13 +211,24 @@ var Selection = /** @class */ (function () {
                             ele.setAttribute('stroke', _this.maps.layers[layerIndex_2].navigationLineSettings[index].color);
                         }
                     }
-                    if (!getElement(_this.selectionType + 'selectionMap')) {
-                        document.body.appendChild(createStyle(_this.selectionType + 'selectionMap', _this.selectionType + 'selectionMapStyle', eventArgs));
+                    if (!isLineStringShape) {
+                        if (!getElement(_this.selectionType + 'selectionMap')) {
+                            document.body.appendChild(createStyle(_this.selectionType + 'selectionMap', _this.selectionType + 'selectionMapStyle', eventArgs));
+                        }
+                        else {
+                            customizeStyle(_this.selectionType + 'selectionMap', _this.selectionType + 'selectionMapStyle', eventArgs);
+                        }
+                        targetElement.setAttribute('class', _this.selectionType + 'selectionMapStyle');
                     }
                     else {
-                        customizeStyle(_this.selectionType + 'selectionMap', _this.selectionType + 'selectionMapStyle', eventArgs);
+                        if (!getElement('LineselectionMap')) {
+                            document.body.appendChild(createStyle('LineselectionMap', 'LineselectionMapStyle', eventArgs));
+                        }
+                        else {
+                            customizeStyle('LineselectionMap', 'LineselectionMapStyle', eventArgs);
+                        }
+                        targetElement.setAttribute('class', 'LineselectionMapStyle');
                     }
-                    targetElement.setAttribute('class', _this.selectionType + 'selectionMapStyle');
                     if (targetElement.getAttribute('class') === 'ShapeselectionMapStyle') {
                         _this.maps.shapeSelectionClass = getElement(_this.selectionType + 'selectionMap');
                         _this.maps.selectedElementId.push(targetElement.getAttribute('id'));
@@ -272,15 +297,13 @@ var Selection = /** @class */ (function () {
     /**
      * To destroy the selection.
      *
-     * @param {Maps} maps - Specifies the maps instance.
      * @returns {void}
      * @private
      */
-    Selection.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
+    Selection.prototype.destroy = function () {
+        this.selectionsettings = null;
         this.removeEventListener();
+        this.maps = null;
     };
     return Selection;
 }());

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

@@ -5,14 +5,12 @@ import { Tooltip } from '@syncfusion/ej2-svg-base';
  */
 export declare class MapsTooltip {
     private maps;
-    private tooltipSettings;
     /**
      * @private
      */
     svgTooltip: Tooltip;
     private isTouch;
     private tooltipId;
-    private currentTime;
     private clearTimeout;
     tooltipTargetID: string;
     constructor(maps: Maps);
@@ -27,7 +25,8 @@ export declare class MapsTooltip {
     private setTooltipContent;
     private formatter;
     mouseUpHandler(e: PointerEvent): void;
-    removeTooltip(): void;
+    removeTooltip(): boolean;
+    private clearTooltip;
     /**
      * To bind events for tooltip module
      */
@@ -42,9 +41,8 @@ export declare class MapsTooltip {
     /**
      * To destroy the tooltip.
      *
-     * @param {Maps} maps Specifies the maps instance
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }

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

@@ -184,7 +184,7 @@ var MapsTooltip = /** @class */ (function () {
                 options: tooltipOption,
                 fill: option.fill,
                 maps: this.maps,
-                element: target, eventArgs: e
+                element: target, eventArgs: e, content: !isNullOrUndefined(currentData) ? currentData.toString() : ''
             };
             this.maps.trigger(tooltipRender, tooltipArgs, function (args) {
                 if (!tooltipArgs.cancel && option.visible && !isNullOrUndefined(currentData) &&
@@ -202,7 +202,7 @@ var MapsTooltip = /** @class */ (function () {
                             header: '',
                             data: option['data'],
                             template: option['template'],
-                            content: [currentData.toString()],
+                            content: tooltipArgs.content.toString() != currentData.toString() ? [tooltipArgs.content.toString()] : [currentData.toString()],
                             shapes: [],
                             location: option['location'],
                             palette: [markerFill],
@@ -218,7 +218,7 @@ var MapsTooltip = /** @class */ (function () {
                             header: '',
                             data: tooltipArgs.options['data'],
                             template: tooltipArgs.options['template'],
-                            content: [currentData.toString()],
+                            content: tooltipArgs.content.toString() != currentData.toString() ? [tooltipArgs.content.toString()] : [currentData.toString()],
                             shapes: [],
                             location: tooltipArgs.options['location'],
                             palette: [markerFill],
@@ -228,6 +228,10 @@ var MapsTooltip = /** @class */ (function () {
                             fill: tooltipArgs.fill || _this.maps.themeStyle.tooltipFillColor
                         });
                     }
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    if (_this.maps.isVue || _this.maps.isVue3) {
+                        _this.svgTooltip.controlInstance = _this.maps;
+                    }
                     _this.svgTooltip.opacity = _this.maps.themeStyle.tooltipFillOpacity || _this.svgTooltip.opacity;
                     _this.svgTooltip.appendTo(tooltipEle);
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -241,9 +245,7 @@ var MapsTooltip = /** @class */ (function () {
                     }
                 }
                 else {
-                    _this.removeTooltip();
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    _this.maps.clearTemplate();
+                    _this.clearTooltip();
                 }
             });
             if (this.svgTooltip) {
@@ -258,9 +260,7 @@ var MapsTooltip = /** @class */ (function () {
                 });
             }
             else {
-                this.removeTooltip();
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                this.maps.clearTemplate();
+                this.clearTooltip();
             }
         }
         else {
@@ -270,9 +270,7 @@ var MapsTooltip = /** @class */ (function () {
                 this.maps.notify(click, this);
             }
             else {
-                this.removeTooltip();
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                this.maps.clearTemplate();
+                this.clearTooltip();
             }
         }
     };
@@ -318,8 +316,18 @@ var MapsTooltip = /** @class */ (function () {
         }
     };
     MapsTooltip.prototype.removeTooltip = function () {
+        var isTooltipRemoved = false;
         if (document.getElementsByClassName('EJ2-maps-Tooltip').length > 0) {
             remove(document.getElementsByClassName('EJ2-maps-Tooltip')[0]);
+            isTooltipRemoved = true;
+        }
+        return isTooltipRemoved;
+    };
+    MapsTooltip.prototype.clearTooltip = function () {
+        var isTooltipRemoved = this.removeTooltip();
+        if (isTooltipRemoved) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            this.maps.clearTemplate();
         }
     };
     // eslint-disable-next-line valid-jsdoc
@@ -368,12 +376,17 @@ var MapsTooltip = /** @class */ (function () {
     /**
      * To destroy the tooltip.
      *
-     * @param {Maps} maps Specifies the maps instance
      * @returns {void}
      * @private
      */
-    MapsTooltip.prototype.destroy = function (maps) {
+    MapsTooltip.prototype.destroy = function () {
+        if (!isNullOrUndefined(this.svgTooltip)) {
+            this.svgTooltip.destroy();
+        }
+        this.svgTooltip = null;
         this.removeEventListener();
+        //TODO: Calling the below code throws spec issue.
+        //this.maps = null;
     };
     return MapsTooltip;
 }());

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

@@ -8,13 +8,10 @@ import { PanDirection } from '../utils/enum';
 export declare class Zoom {
     private maps;
     toolBarGroup: Element;
-    private groupElements;
     private currentToolbarEle;
     zoomingRect: Rect;
     selectionColor: string;
     private fillColor;
-    private zoomInElements;
-    private zoomOutElements;
     private zoomElements;
     private panElements;
     isPanning: boolean;
@@ -28,7 +25,6 @@ export declare class Zoom {
     touchStartList: ITouches[] | TouchList;
     touchMoveList: ITouches[] | TouchList;
     previousTouchMoveList: ITouches[] | TouchList;
-    private pinchRect;
     mouseDownPoints: Point;
     mouseMovePoints: Point;
     isDragZoom: boolean;
@@ -44,7 +40,6 @@ export declare class Zoom {
     private lastScale;
     private pinchFactor;
     private startTouches;
-    private shapeZoomLocation;
     private zoomshapewidth;
     private index;
     intersect: any[];
@@ -69,6 +64,7 @@ export declare class Zoom {
      * @returns {void}
      */
     performZooming(position: Point, newZoomFactor: number, type: string): void;
+    private calculateInitalZoomTranslatePoint;
     private triggerZoomEvent;
     private getTileTranslatePosition;
     performRectZooming(): void;
@@ -87,7 +83,7 @@ export declare class Zoom {
      * @returns {void}
      */
     private animateTransform;
-    applyTransform(animate?: boolean): void;
+    applyTransform(maps: Maps, animate?: boolean): void;
     private markerTranslates;
     /**
      * To translate the layer template elements
@@ -156,9 +152,8 @@ export declare class Zoom {
     /**
      * To destroy the zoom.
      *
-     * @param {Maps} maps - Specifies the instance of the maps.
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }