@syncfusion/ej2-maps 23.1.38 → 23.1.42

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

@@ -1053,11 +1053,14 @@ function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerC
         while (0 < clusterGroup.childNodes.length) {
             markerCollection.insertBefore(clusterGroup.childNodes[0], markerCollection.firstChild);
         }
-        if (check) {
-            layerElement.appendChild(markerCollection);
+        if (!check) {
+            getElementByID(maps.element.id + '_Secondary_Element').appendChild(markerCollection);
+        }
+        const element = document.getElementById(maps.element.id + '_LayerIndex_' + layerIndex + '_Polygon_Group');
+        if (isNullOrUndefined(element)) {
+            layerElement.insertBefore(markerCollection, layerElement.firstChild);
         }
         else {
-            getElementByID(maps.element.id + '_Secondary_Element').appendChild(markerCollection);
             layerElement.appendChild(markerCollection);
         }
         const markerCluster = document.getElementById(maps.element.id + '_LayerIndex_' + layerIndex + '_markerCluster');
@@ -1066,7 +1069,11 @@ function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerC
         }
         if (zoomCheck) {
             const layerGroupElement = document.getElementById(maps.element.id + '_Layer_Collections');
-            if (!isNullOrUndefined(layerGroupElement)) {
+            const element = document.getElementById(maps.element.id + '_LayerIndex_' + (layerIndex + 1));
+            if (!isNullOrUndefined(layerGroupElement) && !isNullOrUndefined(element)) {
+                layerGroupElement.insertBefore(layerElement, element);
+            }
+            else if (!isNullOrUndefined(layerGroupElement)) {
                 layerGroupElement.appendChild(layerElement);
             }
         }
@@ -2139,6 +2146,9 @@ function getZoomTranslate(mapObject, layer, animate) {
             // eslint-disable-next-line no-self-assign
             mapObject.mapScaleValue = mapObject.mapScaleValue;
         }
+        else if (!isNullOrUndefined(mapObject.mapScaleValue) && mapObject.mapScaleValue <= mapObject.scale) {
+            mapObject.mapScaleValue = mapObject.scale;
+        }
         else {
             mapObject.mapScaleValue = zoomFactorValue;
         }
@@ -5084,6 +5094,7 @@ class Marker {
                             maps.element.appendChild(maps.svgObject);
                             if ((currentLayer.layerType === 'OSM' || (currentLayer.urlTemplate.indexOf('openstreetmap') !== -1 && isNullOrUndefined(currentLayer.shapeData)))
                                 && maps.zoomSettings.enable) {
+                                clusterTemplate(currentLayer, this.markerSVGObject, maps, layerIndex, this.markerSVGObject, layerElement, true, false);
                                 layerElement.appendChild(this.markerSVGObject);
                             }
                             else {
@@ -5265,7 +5276,13 @@ class Marker {
      * @private
      */
     markerClick(e) {
-        const target = e.target.id;
+        let target = e.target.id;
+        if (target.indexOf(this.maps.element.id) === -1) {
+            const ancestor = e.target.closest('.' + this.maps.element.id + '_marker_template_element');
+            if (!isNullOrUndefined(ancestor) && ancestor.id.indexOf('_MarkerIndex_') > -1) {
+                target = ancestor.id;
+            }
+        }
         if (target.indexOf('_LayerIndex_') === -1 || target.indexOf('_cluster_') > 0) {
             return;
         }
@@ -6560,7 +6577,7 @@ class LayerPanel {
         pathEle.setAttribute('aria-label', ((!isNullOrUndefined(currentShapeData['property'])) ?
             (currentShapeData['property'][properties]) : ''));
         if (this.currentLayer.selectionSettings.enable || this.currentLayer.highlightSettings.enable) {
-            pathEle.tabIndex = this.mapObject.tabIndex + index + 3;
+            pathEle.tabIndex = this.mapObject.tabIndex;
             pathEle.setAttribute('role', 'button');
             pathEle.style.cursor = this.currentLayer.highlightSettings.enable && !this.currentLayer.selectionSettings.enable ? 'default' : 'pointer';
         }
@@ -8107,7 +8124,7 @@ let Maps = class Maps extends Component {
      */
     addTabIndex() {
         this.element.setAttribute('aria-label', this.description || 'Maps Element');
-        this.element.setAttribute('role', '');
+        this.element.setAttribute('role', 'region');
         this.element.tabIndex = this.tabIndex;
     }
     setSecondaryElementPosition() {
@@ -8354,7 +8371,6 @@ let Maps = class Maps extends Component {
             const titleBounds = new Rect(location.x, location.y, elementSize.width, elementSize.height);
             const 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);
@@ -9105,6 +9121,7 @@ let Maps = class Maps extends Component {
         if (!this.isDestroyed) {
             this.zoomNotApplied = false;
             let isRefresh = this.zoomSettings.zoomFactor === zoomFactor;
+            this.previousProjection = null;
             if (!this.isTileMap && this.zoomModule) {
                 if (!isNullOrUndefined(centerPosition)) {
                     this.zoomSettings.zoomFactor = zoomFactor;
@@ -10008,7 +10025,7 @@ __decorate([
     Property(null)
 ], Maps.prototype, "description", void 0);
 __decorate([
-    Property(1)
+    Property(0)
 ], Maps.prototype, "tabIndex", void 0);
 __decorate([
     Complex({ latitude: null, longitude: null }, CenterPosition)
@@ -11539,14 +11556,34 @@ class Legend {
                         leftPageElement.appendChild(render.drawPath(leftPageOptions));
                         const leftRectPageOptions = new RectOption(map.element.id + '_Left_Page_Rect', 'transparent', {}, 1, new Rect(leftPageX - (width / 2), (locY - (height * 2)), width * 2, spacing * 2), null, null, '', '');
                         let pathEle = render.drawRectangle(leftRectPageOptions);
-                        pathEle.tabIndex = (page + 1) === 1 ? -1 : (map.tabIndex + 1);
+                        pathEle.setAttribute('aria-label', 'Navigate to the previous legend items');
+                        pathEle.setAttribute('role', 'button');
+                        pathEle.tabIndex = (page + 1) === 1 ? -1 : map.tabIndex;
+                        if ((page + 1) === 1) {
+                            pathEle.style.cursor = 'default';
+                            pathEle.style.setProperty('outline', 'none');
+                        }
+                        else {
+                            pathEle.style.cursor = 'pointer';
+                            pathEle.style.removeProperty('outline');
+                        }
                         leftPageElement.appendChild(pathEle);
                         this.wireEvents(leftPageElement);
                         const rightPageOptions = new PathOption(map.element.id + '_Right_Page', this.maps.themeStyle.legendTextColor, 0, this.maps.themeStyle.legendTextColor, ((page + 1) === this.totalPages.length ? 0.5 : 1), 1, '', rightPath);
                         rightPageElement.appendChild(render.drawPath(rightPageOptions));
                         const rightRectPageOptions = new RectOption(map.element.id + '_Right_Page_Rect', 'transparent', {}, 1, new Rect(rightPageX - spacing - (width / 2), (locY - (height * 2)), width * 2, spacing * 2), null, null, '', '');
                         pathEle = render.drawRectangle(rightRectPageOptions);
-                        pathEle.tabIndex = (page + 1) === this.totalPages.length ? -1 : (map.tabIndex + 2);
+                        pathEle.setAttribute('aria-label', 'Navigate to the next legend items');
+                        pathEle.setAttribute('role', 'button');
+                        pathEle.tabIndex = (page + 1) === this.totalPages.length ? -1 : map.tabIndex;
+                        if ((page + 1) === this.totalPages.length) {
+                            pathEle.style.cursor = 'default';
+                            pathEle.style.setProperty('outline', 'none');
+                        }
+                        else {
+                            pathEle.style.cursor = 'pointer';
+                            pathEle.style.removeProperty('outline');
+                        }
                         rightPageElement.appendChild(pathEle);
                         this.wireEvents(rightPageElement);
                         pagingGroup.appendChild(leftPageElement);
@@ -13966,7 +14003,8 @@ class MapsTooltip {
                             areaBounds: this.maps.mapAreaRect,
                             textStyle: option['textStyle'],
                             availableSize: this.maps.availableSize,
-                            fill: option.fill || this.maps.themeStyle.tooltipFillColor
+                            fill: option.fill || this.maps.themeStyle.tooltipFillColor,
+                            enableShadow: true
                         });
                     }
                     else {
@@ -13983,7 +14021,8 @@ class MapsTooltip {
                             areaBounds: this.maps.mapAreaRect,
                             textStyle: tooltipArgs.options['textStyle'],
                             availableSize: this.maps.availableSize,
-                            fill: tooltipArgs.fill || this.maps.themeStyle.tooltipFillColor
+                            fill: tooltipArgs.fill || this.maps.themeStyle.tooltipFillColor,
+                            enableShadow: true
                         });
                     }
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -14459,6 +14498,7 @@ class Zoom {
         const availSize = map.mapAreaRect;
         map.previousScale = map.scale;
         map.previousPoint = map.translatePoint;
+        map.previousProjection = map.projectionType;
         const prevTilePoint = map.tileTranslatePoint;
         const scale = calculateScale(this.touchStartList, this.touchMoveList);
         const touchCenter = getTouchCenter(getTouches(this.touchMoveList, this.maps));
@@ -14522,6 +14562,7 @@ class Zoom {
                 map.mapLayerPanel.generateTiles(newTileFactor, map.tileTranslatePoint);
             }
         }
+        map.mapScaleValue = zoomCalculationFactor;
         if (!isZoomCancelled) {
             this.applyTransform(map);
         }
@@ -14837,7 +14878,12 @@ class Zoom {
                         ? this.maps.markerNullCount + 1 : this.maps.markerNullCount;
                     const markerDataLength = markerDatas.length - this.maps.markerNullCount;
                     if (markerSVGObject.childElementCount === (markerDataLength - markerTemplateCounts - nullCount) && (type !== 'Template')) {
-                        layerElement.appendChild(markerSVGObject);
+                        if (this.maps.isTileMap) {
+                            layerElement.insertBefore(markerSVGObject, layerElement.firstElementChild);
+                        }
+                        else {
+                            layerElement.appendChild(markerSVGObject);
+                        }
                         if (currentLayers.markerClusterSettings.allowClustering) {
                             this.maps.svgObject.appendChild(markerSVGObject);
                             this.maps.element.appendChild(this.maps.svgObject);
@@ -15232,7 +15278,7 @@ class Zoom {
         const size = map.mapAreaRect;
         const translatePoint = map.previousPoint = map.translatePoint;
         const prevTilePoint = map.tileTranslatePoint;
-        map.previousProjection = map.projectionType;
+        map.previousProjection = (type !== 'Reset') ? map.projectionType : null;
         zoomFactor = (type === 'ZoomOut') ? (Math.round(zoomFactor) === 1 ? 1 : zoomFactor) : zoomFactor;
         zoomFactor = (type === 'Reset') ? minZoom : (Math.round(zoomFactor) === 0) ? 1 : zoomFactor;
         zoomFactor = (minZoom > zoomFactor && type === 'ZoomIn') ? minZoom + 1 : zoomFactor;