【fix】修复mapboxgl initmap 矢量瓦片时初始级别不对的问题

Author: songyumeng

src/common/iServer/InitMapServiceBase.js

@@ -1,7 +1,7 @@
 /* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
  * This program are made available under the terms of the Apache License, Version 2.0
  * which accompanies this distribution and is available at http://www.apache.org/licenses/LICENSE-2.0.html.*/
- import { scaleToResolution, getZoomByResolution } from '../util/MapCalculateUtil';
+import { scaleToResolution, getZoomByResolution } from '../util/MapCalculateUtil';
 
 /**
  * @private
@@ -149,13 +149,19 @@ export function getTileset(tilesets = [], targets) {
 
 /**
  * @private
- * @function scalesToResolutions
+ * @function extentToResolutions
  * @description mapboxgl maplibregl 获取地图resolutions。
  * @returns {Array} resolutions
  */
- export function scalesToResolutions(bounds, maxZoom = 22, tileSize = 512) {
+export function extentToResolutions(bounds, maxZoom = 22, tileSize = 512) {
   var resolutions = [];
-  const maxReolution = Math.abs(bounds.left - bounds.right) / tileSize;
+  var left = bounds.left;
+  var right = bounds.right;
+  if (Array.isArray(bounds)) {
+    left = bounds[0];
+    right = bounds[2];
+  }
+  const maxReolution = Math.abs(left - right) / tileSize;
   for (let i = 0; i < maxZoom; i++) {
     resolutions.push(maxReolution / Math.pow(2, i));
   }
@@ -175,7 +181,7 @@ export function getTileset(tilesets = [], targets) {
  * @param {Object} extent - extent。
  * @returns {number} zoom
  */
- export function getZoom({ scale, dpi, coordUnit }, extent) {
-  const resolutions = scalesToResolutions(extent);
+export function getZoom({ scale, dpi, coordUnit }, extent) {
+  const resolutions = extentToResolutions(extent);
   return getZoomByResolution(scaleToResolution(scale, dpi, coordUnit), resolutions);
 }

test/common/iServer/InitMapServiceBaseSpec.js

@@ -0,0 +1,42 @@
+import { extentToResolutions } from '../../../src/common/iServer/InitMapServiceBase'; 
+
+describe('extentToResolutions', () => {
+  it('should calculate resolutions for a given bounding box', () => {
+    const bounds = { left: -180, right: 180 };
+    const resolutions = extentToResolutions(bounds);
+    expect(resolutions.length).toBe(22);
+    expect(resolutions[0]).toBeCloseTo(0.703125);
+    expect(resolutions[21]).toBeCloseTo(0.00000686328125);
+  });
+
+  it('should handle array bounds input', () => {
+    const bounds = [-180, -90, 180, 90];
+    const resolutions = extentToResolutions(bounds);
+    expect(resolutions.length).toBe(22);
+    expect(resolutions[0]).toBeCloseTo(0.703125);
+    expect(resolutions[21]).toBeCloseTo(0.00000686328125);
+  });
+
+  it('should handle custom maxZoom and tileSize', () => {
+    const bounds = { left: -180, right: 180 };
+    const resolutions = extentToResolutions(bounds, 10, 256);
+    expect(resolutions.length).toBe(10);
+    expect(resolutions[0]).toBeCloseTo(1.40625);
+    expect(resolutions[9]).toBeCloseTo(0.00146484375);
+  });
+
+  it('should handle zero width bounds', () => {
+    const bounds = { left: 0, right: 0 };
+    const resolutions = extentToResolutions(bounds);
+    expect(resolutions.length).toBe(22);
+    expect(resolutions[0]).toBe(0);
+  });
+
+  it('should handle negative width bounds', () => {
+    const bounds = { left: 180, right: -180 };
+    const resolutions = extentToResolutions(bounds);
+    expect(resolutions.length).toBe(22);
+    expect(resolutions[0]).toBeCloseTo(0.703125);
+    expect(resolutions[21]).toBeCloseTo(0.00000686328125);
+  });
+});

test/test-main-common.js

@@ -50,6 +50,7 @@ import './common/iServer/GetLayersInfoServiceSpec.js';
 import './common/iServer/GetLayersLegendInfoServiceSpec.js';
 import './common/iServer/GridSpec.js';
 import './common/iServer/ImageSpec.js';
+import './common/iServer/InitMapServiceBaseSpec.js';
 import './common/iServer/InterpolationAnalystServiceSpec.js';
 import './common/iServer/LabelImageCellSpec.js';
 import './common/iServer/LabelMixedStyleSpec.js';