From 5851e54a4f1c10ecf8d1663d3876f6306503b8de Mon Sep 17 00:00:00 2001
From: chenxianhui <chenxianhui@supermap.com>
Date: Mon, 23 Sep 2024 10:32:53 +0800
Subject: [PATCH] =?UTF-8?q?[feature]webmap=E6=96=B0=E5=A2=9E=E6=8E=92?=
=?UTF-8?q?=E5=BA=8F=E6=96=B9=E6=B3=95=20review=20by=20xiongjj?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/common/mapping/MapBase.js | 19 +++++++++++++++++++
src/common/mapping/WebMapBase.js | 9 +++++++++
src/common/mapping/WebMapV2.js | 19 ++++---------------
test/mapboxgl/mapping/WebMapSpec.js | 23 +++++++++++++++++++++++
test/maplibregl/mapping/WebMapSpec.js | 23 +++++++++++++++++++++++
5 files changed, 78 insertions(+), 15 deletions(-)
diff --git a/src/common/mapping/MapBase.js b/src/common/mapping/MapBase.js
index 942114dac..e4bf205d1 100644
--- a/src/common/mapping/MapBase.js
+++ b/src/common/mapping/MapBase.js
@@ -38,6 +38,25 @@ export function createMapClassExtending(SuperClass = class {}) {
this._sourceListModel && this._sourceListModel.toggleLayerVisible(layerId, visible);
}
+ rectifyLayersOrder(appreciableLayers, topLayerBeforeId) {
+ const renderLayers = appreciableLayers
+ .filter((item) => !item.reused)
+ .reduce((layers, layer) => {
+ return layers.concat(layer.renderLayers);
+ }, []);
+ const exsitLayers = renderLayers.filter((layerId) => !!this.map.getLayer(layerId));
+ for (let index = exsitLayers.length - 1; index > -1; index--) {
+ const targetlayerId = exsitLayers[index];
+ const afterLayers = exsitLayers.slice(index + 1);
+ let beforLayerId = afterLayers.find((id) => this.map.style._layers[id]);
+ if (!afterLayers.length) {
+ beforLayerId = topLayerBeforeId;
+ }
+ this.map.moveLayer(targetlayerId, beforLayerId);
+ }
+ return exsitLayers;
+ }
+
echartsLayerResize() {}
updateOverlayLayer() {}
diff --git a/src/common/mapping/WebMapBase.js b/src/common/mapping/WebMapBase.js
index 407b0c9e8..2cb1de67b 100644
--- a/src/common/mapping/WebMapBase.js
+++ b/src/common/mapping/WebMapBase.js
@@ -416,6 +416,15 @@
getWebMapType() {
return this.type;
}
+
+ /**
+ * @version 11.3.0
+ * @function WebMapBase.prototype.rectifyLayersOrder
+ * @description 根据已知顺序的可感知图层，对地图上图顺序进行排序。
+ */
+ rectifyLayersOrder(appreciableLayers, topLayerBeforeId) {
+ this._handler && this._handler.rectifyLayersOrder(appreciableLayers, topLayerBeforeId);
+ }
/**
* @version 11.2.1
diff --git a/src/common/mapping/WebMapV2.js b/src/common/mapping/WebMapV2.js
index c26a13d1c..5f7991045 100644
--- a/src/common/mapping/WebMapV2.js
+++ b/src/common/mapping/WebMapV2.js
@@ -2235,7 +2235,7 @@ export function createWebMapV2Extending(SuperClass, { MapManager, mapRepo }) {
this._changeSourceListModel();
const appreciableLayers = this.getLayers();
const layerOptions = this._getSelfAppreciableLayers(appreciableLayers);
- this._rectifyLayersOrder(layerOptions.layers);
+ this.rectifyLayersOrder(layerOptions.layers);
this.fire('mapcreatesucceeded', {
...layerOptions,
map: this.map,
@@ -2244,22 +2244,11 @@ export function createWebMapV2Extending(SuperClass, { MapManager, mapRepo }) {
}
}
- _rectifyLayersOrder(appreciableLayers, topLayerBeforeId) {
- const renderLayers = appreciableLayers
- .filter((item) => !item.reused)
- .reduce((layers, layer) => {
- return layers.concat(layer.renderLayers);
- }, []);
+ rectifyLayersOrder(appreciableLayers, topLayerBeforeId) {
+ const exsitLayers = super.rectifyLayersOrder(appreciableLayers, topLayerBeforeId);
const labelLayerIds = [];
- const exsitLayers = renderLayers.filter((layerId) => !!this.map.getLayer(layerId));
for (let index = exsitLayers.length - 1; index > -1; index--) {
const targetlayerId = exsitLayers[index];
- const afterLayers = exsitLayers.slice(index + 1);
- let beforLayerId = afterLayers.find((id) => this.map.style._layers[id]);
- if (!afterLayers.length) {
- beforLayerId = topLayerBeforeId;
- }
- this.map.moveLayer(targetlayerId, beforLayerId);
const labelLayerId = this._getSymbolLabelLayerName(targetlayerId);
if (this.map.getLayer(labelLayerId)) {
labelLayerIds.push(labelLayerId);
@@ -2781,7 +2770,7 @@ export function createWebMapV2Extending(SuperClass, { MapManager, mapRepo }) {
const appreciableLayers = this.getLayers();
const selfAppreciableLayers = this.getSelfAppreciableLayers(appreciableLayers);
const topLayerBeforeId = this._findTopLayerBeforeId(selfAppreciableLayers);
- this._rectifyLayersOrder(selfAppreciableLayers, topLayerBeforeId);
+ this.rectifyLayersOrder(selfAppreciableLayers, topLayerBeforeId);
this.fire('layeraddchanged', this._getSelfAppreciableLayers(appreciableLayers));
}
}
diff --git a/test/mapboxgl/mapping/WebMapSpec.js b/test/mapboxgl/mapping/WebMapSpec.js
index cffbf3351..cf9471ed5 100644
--- a/test/mapboxgl/mapping/WebMapSpec.js
+++ b/test/mapboxgl/mapping/WebMapSpec.js
@@ -1263,4 +1263,27 @@ describe('mapboxgl_WebMap', () => {
};
datavizWebmap.once('mapcreatesucceeded', callback);
});
+
+ it('rectifyLayersOrder', (done) => {
+ const commonOption = {
+ server: 'http://fack:8190/iportal/',
+ target: 'map',
+ withCredentials: false
+ };
+ datavizWebmap = new WebMap(
+ '',
+ { ...commonOption },
+ mapOptionsList[0]
+ );
+ const callback = function ({map}) {
+ let layers = datavizWebmap.getLayers();
+ expect(layers.length).toBe(2);
+ let newLayers = [layers[1], layers[0]];
+ datavizWebmap.rectifyLayersOrder(newLayers);
+ const layersOnMap = map.getStyle().layers;
+ expect(layersOnMap[0].id).toBe('未命名数据')
+ done();
+ };
+ datavizWebmap.once('mapcreatesucceeded', callback);
+ });
});
diff --git a/test/maplibregl/mapping/WebMapSpec.js b/test/maplibregl/mapping/WebMapSpec.js
index 995bc517e..20bd1c8e5 100644
--- a/test/maplibregl/mapping/WebMapSpec.js
+++ b/test/maplibregl/mapping/WebMapSpec.js
@@ -1244,4 +1244,27 @@ describe('maplibregl_WebMap', () => {
};
datavizWebmap.once('mapcreatesucceeded', callback);
});
+
+ it('rectifyLayersOrder', (done) => {
+ const commonOption = {
+ server: 'http://fack:8190/iportal/',
+ target: 'map',
+ withCredentials: false
+ };
+ datavizWebmap = new WebMap(
+ '',
+ { ...commonOption },
+ mapOptionsList[0]
+ );
+ const callback = function ({map}) {
+ let layers = datavizWebmap.getLayers();
+ expect(layers.length).toBe(2);
+ let newLayers = [layers[1], layers[0]];
+ datavizWebmap.rectifyLayersOrder(newLayers);
+ const layersOnMap = map.getStyle().layers;
+ expect(layersOnMap[0].id).toBe('未命名数据')
+ done();
+ };
+ datavizWebmap.once('mapcreatesucceeded', callback);
+ });
});