【fix】修复classic mapv 热力图浏览器缩放比例不为100%偏移的问题，修复webmap加载wmts可能的报错问题 review by luox zhaoq

songyumeng · songyumeng · commit 8ab0ddde8e5e · 2021-03-04T18:54:18.000+08:00
diff --git a/src/classic/overlay/MapVLayer.js b/src/classic/overlay/MapVLayer.js
@@ -52,6 +52,7 @@ export class MapVLayer extends SuperMap.Layer {
         if (options) {
             SuperMap.Util.extend(this, options);
         }
+        
         //MapV图要求使用canvas绘制，判断是否支持
         this.canvas = document.createElement('canvas');
         if (!this.canvas.getContext) {
@@ -67,7 +68,7 @@ export class MapVLayer extends SuperMap.Layer {
         this.canvasContext = this.canvas.getContext(context);
         var global$2 = typeof window === 'undefined' ? {} : window;
         var devicePixelRatio = this.devicePixelRatio = global$2.devicePixelRatio || 1;
-        if (context == '2d') {
+        if (context === '2d') {
             this.canvasContext.scale(devicePixelRatio, devicePixelRatio);
         }
         this.attribution =
@@ -162,6 +163,7 @@ export class MapVLayer extends SuperMap.Layer {
     setMap(map) {
         super.setMap(map);
         this.renderer = new MapVRenderer(map, this, this.dataSet, this.options);
+        this.renderer.devicePixelRatio = this.devicePixelRatio;
         if (!this.supported) {
             this.map.removeLayer(this);
         } else {
@@ -192,8 +194,14 @@ export class MapVLayer extends SuperMap.Layer {
             var size = this.map.getSize();
             this.div.style.width = parseInt(size.w) + 'px';
             this.div.style.height = parseInt(size.h) + 'px';
-            this.canvas.width = parseInt(size.w);
-            this.canvas.height = parseInt(size.h);
+            if (this.options.draw === 'heatmap') {
+                this.canvas.width = parseInt(size.w) * this.devicePixelRatio;
+                this.canvas.height = parseInt(size.h) * this.devicePixelRatio;
+            } else {
+                this.canvas.width = parseInt(size.w);
+                this.canvas.height = parseInt(size.h);
+            }
+           
             this.canvas.style.width = this.div.style.width;
             this.canvas.style.height = this.div.style.height;
             this.maxWidth = size.w;
diff --git a/src/classic/overlay/mapv/MapVRenderer.js b/src/classic/overlay/mapv/MapVRenderer.js
@@ -42,7 +42,8 @@ export class MapVRenderer extends MapVBaseLayer {
      */
     clickEvent(e) {
         var pixel = e.xy;
-        super.clickEvent(pixel, e);
+        var devicePixelRatio = this.devicePixelRatio || 1;
+        super.clickEvent({ x: pixel.x / devicePixelRatio, y: pixel.y / devicePixelRatio }, e);
     }
 
     /**
@@ -64,10 +65,10 @@ export class MapVRenderer extends MapVBaseLayer {
 
         if (this.options.methods) {
             if (this.options.methods.click) {
-                map.events.on({'click': this.clickEvent});
+                map.events.on({ click: this.clickEvent });
             }
             if (this.options.methods.mousemove) {
-                map.events.on({'mousemove': this.mousemoveEvent});
+                map.events.on({ mousemove: this.mousemoveEvent });
             }
         }
     }
@@ -81,10 +82,10 @@ export class MapVRenderer extends MapVBaseLayer {
 
         if (this.options.methods) {
             if (this.options.methods.click) {
-                map.events.un({'click': this.clickEvent});
+                map.events.un({ click: this.clickEvent });
             }
             if (this.options.methods.mousemove) {
-                map.events.un({'mousemove': this.mousemoveEvent});
+                map.events.un({ mousemove: this.mousemoveEvent });
             }
         }
     }
@@ -109,7 +110,7 @@ export class MapVRenderer extends MapVBaseLayer {
             _data = data.get();
         }
         this.dataSet.add(_data);
-        this.update({options: options});
+        this.update({ options: options });
     }
 
     /**
@@ -125,7 +126,7 @@ export class MapVRenderer extends MapVBaseLayer {
         }
         this.dataSet = this.dataSet || new DataSet();
         this.dataSet.set(_data);
-        this.update({options: options});
+        this.update({ options: options });
     }
 
     /**
@@ -147,11 +148,11 @@ export class MapVRenderer extends MapVBaseLayer {
         }
         var newData = this.dataSet.get({
             filter: function (data) {
-                return (filter != null && typeof filter === "function") ? !filter(data) : true;
+                return filter != null && typeof filter === 'function' ? !filter(data) : true;
             }
         });
         this.dataSet.set(newData);
-        this.update({options: null});
+        this.update({ options: null });
     }
 
     /**
@@ -160,7 +161,7 @@ export class MapVRenderer extends MapVBaseLayer {
      */
     clearData() {
         this.dataSet && this.dataSet.clear();
-        this.update({options: null});
+        this.update({ options: null });
     }
 
     /**
@@ -178,15 +179,24 @@ export class MapVRenderer extends MapVBaseLayer {
      * @deprecated
      */
     transferToMercator() {
-        if (this.options.coordType && ["bd09mc", "coordinates_mercator"].indexOf(this.options.coordType) > -1) {
+        if (this.options.coordType && ['bd09mc', 'coordinates_mercator'].indexOf(this.options.coordType) > -1) {
             var data = this.dataSet.get();
-            data = this.dataSet.transferCoordinate(data, function (coordinates) {
-                var pixel = SuperMap.Projection.transform({
-                    x: coordinates[0],
-                    y: coordinates[1]
-                }, "EPSG:3857", "EPSG:4326");
-                return [pixel.x, pixel.y];
-            }, 'coordinates', 'coordinates');
+            data = this.dataSet.transferCoordinate(
+                data,
+                function (coordinates) {
+                    var pixel = SuperMap.Projection.transform(
+                        {
+                            x: coordinates[0],
+                            y: coordinates[1]
+                        },
+                        'EPSG:3857',
+                        'EPSG:4326'
+                    );
+                    return [pixel.x, pixel.y];
+                },
+                'coordinates',
+                'coordinates'
+            );
             this.dataSet._set(data);
         }
     }
@@ -226,15 +236,18 @@ export class MapVRenderer extends MapVBaseLayer {
             context.clear(context.COLOR_BUFFER_BIT);
         }
 
-        if (self.options.minZoom && map.getZoom() < self.options.minZoom || self.options.maxZoom && map.getZoom() > self.options.maxZoom) {
+        if (
+            (self.options.minZoom && map.getZoom() < self.options.minZoom) ||
+            (self.options.maxZoom && map.getZoom() > self.options.maxZoom)
+        ) {
             return;
         }
         var layer = self.canvasLayer;
+
         var dataGetOptions = {
             fromColumn: 'coordinates',
             transferCoordinate: function (coordinate) {
-                // var coord = layer.transferToMapLatLng({lon: coordinate[0], lat: coordinate[1]});
-                var coord = {lon: coordinate[0], lat: coordinate[1]};
+                var coord = { lon: coordinate[0], lat: coordinate[1] };
                 var worldPoint = map.getViewPortPxFromLonLat(coord);
                 return [worldPoint.x, worldPoint.y];
             }
@@ -243,8 +256,8 @@ export class MapVRenderer extends MapVBaseLayer {
         if (time !== undefined) {
             dataGetOptions.filter = function (item) {
                 var trails = animationOptions.trails || 10;
-                return (time && item.time > (time - trails) && item.time < time);
-            }
+                return time && item.time > time - trails && item.time < time;
+            };
         }
 
         var data = self.dataSet.get(dataGetOptions);
@@ -276,9 +289,7 @@ export class MapVRenderer extends MapVBaseLayer {
         self.options.updateCallback && self.options.updateCallback(time);
     }
 
-
     init(options) {
-
         var self = this;
 
         self.options = options;
@@ -299,8 +310,8 @@ export class MapVRenderer extends MapVBaseLayer {
      * @description 添加动画事件。
      */
     addAnimatorEvent() {
-        this.map.events.on({'movestart': this.animatorMovestartEvent.bind(this)});
-        this.map.events.on({'moveend': this.animatorMoveendEvent.bind(this)});
+        this.map.events.on({ movestart: this.animatorMovestartEvent.bind(this) });
+        this.map.events.on({ moveend: this.animatorMoveendEvent.bind(this) });
     }
 
     /**
@@ -328,7 +339,6 @@ export class MapVRenderer extends MapVBaseLayer {
         this.map.removeLayer(this.canvasLayer);
     }
 
-
     /**
      * @function MapvRenderer.prototype.draw
      * @description 渲染绘制。
diff --git a/src/openlayers/mapping/WebMap.js b/src/openlayers/mapping/WebMap.js
@@ -1420,6 +1420,18 @@ export class WebMap extends Observable {
                 }
                 let name = layerInfo.name, extent;
                 if (layerBounds) {
+                    if (layerBounds[0] < -180) {
+                        layerBounds[0] = -180;
+                    }
+                    if (layerBounds[1] < -90) {
+                        layerBounds[1] = -90;
+                    }
+                    if (layerBounds[2] > 180) {
+                        layerBounds[2] = 180;
+                    }
+                    if (layerBounds[3] > 90) {
+                        layerBounds[3] = 90;
+                    }
                     extent = olProj.transformExtent(layerBounds, 'EPSG:4326', that.baseProjection);
                 } else {
                     extent = olProj.get(that.baseProjection).getExtent()
