Skip to content

Commit 0594f49

Browse files
xiongjiaojiaoxiongjiaojiao
committed
【update】webmap3.0 api 优化
1 parent 3ece97b commit 0594f49

File tree

15 files changed

+822
-252
lines changed

15 files changed

+822
-252
lines changed

‎examples/locales/en-US/resources.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -597,7 +597,6 @@ window.examplesResources = {
597597
"title_iportalWebMap_unicode": "SuperMap iPortal Point Style",
598598
"title_iportalWebMap_unique": "SuperMap iPortal Unique Map",
599599
"title_iportalWebMap_label": "SuperMap iPortal Label Map",
600-
"title_iportalWebMap_mapstudio": "SuperMap iPortal Map Studio",
601600
"title_earthquakeHeatMapLayer": "Earthquake occurrences(2005-2016)(Classic)",
602601
"title_echartsEarthquake": "Earthquake occurrences(2005-2016)",
603602
"title_l_echartsEarthquake": "Earthquake heat map (2001-2014)",

‎examples/locales/zh-CN/resources.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -541,7 +541,6 @@ window.examplesResources = {
541541
"title_iportalWebMap_unicode": "SuperMap iPortal 点样式",
542542
"title_iportalWebMap_unique": "SuperMap iPortal 单值专题图",
543543
"title_iportalWebMap_label": "SuperMap iPortal 标签专题图",
544-
"title_iportalWebMap_mapstudio": "SuperMap iPortal Map Studio",
545544
"title_earthquakeHeatMapLayer": "2005-2016地震次数(Classic)",
546545
"title_echartsEarthquake": "2005到2016年地震发生情况",
547546
"title_l_echartsEarthquake": "2001年到2014年地震热力图",

‎examples/mapboxgl/config.js‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -599,13 +599,6 @@ var exampleConfig = {
599599
version: '9.1.2',
600600
thumbnail: 'iPortalWebmap_unicode.png',
601601
fileName: 'iPortalWebmap_unicode'
602-
},
603-
{
604-
name: 'WebMap 3.0',
605-
name_en: 'WebMap 3.0',
606-
version: '9.1.2',
607-
thumbnail: 'iPortalWebmap_mapstudio.png',
608-
fileName: 'iPortalWebmap_mapstudio'
609602
}
610603
]
611604
}

‎examples/mapboxgl/iPortalWebmap_mapstudio.html‎

Lines changed: 0 additions & 81 deletions
This file was deleted.

‎examples/mapboxgl/img/iPortalWebmap_mapstudio.png‎

-47.7 KB
Binary file not shown.

‎src/mapboxgl/mapping/WebMap.js‎

Lines changed: 103 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -42,55 +42,55 @@ import { WebMap as WebMapV3 } from './webmap/v3/WebMap';
4242
* @usage
4343
*/
4444
export class WebMap extends mapboxgl.Evented {
45-
constructor(id, options = {}, mapOptions) {
46-
super();
47-
this.mapId = id;
45+
constructor(id, options = {}, mapOptions) {
46+
super();
47+
this.mapId = id;
4848
this.options = Object.assign({}, options);
4949
this.options.server = this._formatServerUrl(options.server);
5050
this.options.target = options.target || 'map';
5151
this.options.withCredentials = options.withCredentials || false;
5252
this.mapOptions = mapOptions;
53-
this._createWebMap();
53+
this._createWebMap();
5454
this.on('mapinitialized', () => {
5555
this.map.on('remove', () => {
5656
this._stopCanvg();
5757
});
5858
});
59-
}
60-
/**
61-
* @function WebMap.prototype.resize
62-
* @description 地图 resize。
63-
*/
64-
resize() {
65-
this.map.resize();
59+
}
60+
/**
61+
* @function WebMap.prototype.resize
62+
* @description 地图 resize。
63+
*/
64+
resize() {
65+
this.map.resize();
6666
}
6767

6868
/**
69-
* @function WebMap.prototype.setMapId
70-
* @param {string} mapId - webMap 地图 ID。
71-
* @description 设置 WebMap ID。
72-
*/
69+
* @function WebMap.prototype.setMapId
70+
* @param {string} mapId - webMap 地图 ID。
71+
* @description 设置 WebMap ID。
72+
*/
7373
setMapId(mapId) {
7474
this.mapId = mapId;
7575
this._createWebMap();
7676
}
7777

7878
/**
7979
* @function WebMap.prototype.setWebMapOptions
80-
* @param {Object} webMapOptions - webMap 参数。
81-
* @description 设置 webMap 参数。
82-
*/
80+
* @param {Object} webMapOptions - webMap 参数。
81+
* @description 设置 webMap 参数。
82+
*/
8383
setWebMapOptions(webMapOptions) {
8484
const server = this._formatServerUrl(webMapOptions.server);
8585
this.options.server = server;
8686
this._createWebMap();
8787
}
8888

8989
/**
90-
* @function WebMap.prototype.setMapOptions
91-
* @param {Object} mapOptions - map 参数。
92-
* @description 设置 map 参数。
93-
*/
90+
* @function WebMap.prototype.setMapOptions
91+
* @param {Object} mapOptions - map 参数。
92+
* @description 设置 map 参数。
93+
*/
9494
setMapOptions(mapOptions) {
9595
let { center, zoom, maxBounds, minZoom, maxZoom, isWorldCopy, bearing, pitch } = mapOptions;
9696
center && center.length && this.map.setCenter(center);
@@ -109,22 +109,24 @@ export class WebMap extends mapboxgl.Evented {
109109
* @description 登陆窗口后添加地图图层。
110110
*/
111111
_createWebMap() {
112-
const mapUrl = Util.transformUrl(Object.assign({ url: `${this.options.server}web/maps/${this.mapId}/map` }, this.options));
113-
this._getMapInfo(mapUrl);
114-
}
112+
const mapUrl = Util.transformUrl(
113+
Object.assign({ url: `${this.options.server}web/maps/${this.mapId}/map` }, this.options)
114+
);
115+
this._getMapInfo(mapUrl);
116+
}
115117

116-
/**
117-
* @private
118-
* @function WebMap.prototype._formatServerUrl
119-
* @description 格式化服务地址
120-
*/
121-
_formatServerUrl(server) {
122-
let urlArr = server.split('');
123-
if (urlArr[urlArr.length - 1] !== '/') {
124-
server += '/';
125-
}
126-
return server;
127-
}
118+
/**
119+
* @private
120+
* @function WebMap.prototype._formatServerUrl
121+
* @description 格式化服务地址
122+
*/
123+
_formatServerUrl(server) {
124+
let urlArr = server.split('');
125+
if (urlArr[urlArr.length - 1] !== '/') {
126+
server += '/';
127+
}
128+
return server;
129+
}
128130

129131
/**
130132
* @private
@@ -133,49 +135,43 @@ export class WebMap extends mapboxgl.Evented {
133135
* @param {string} mapUrl - 请求地图的 url。
134136
*/
135137
_getMapInfo(mapUrl) {
136-
FetchRequest.get(mapUrl, null, { withCredentials: this.options.withCredentials })
137-
.then((response) => {
138-
return response.json();
139-
})
140-
.then((mapInfo) => {
141-
const projectionMap = {
142-
'EPSG:4490': 'EPSG:4490',
143-
'EPSG:4214': 'EPSG:4214',
144-
'EPSG:4610': 'EPSG:4610',
145-
'EPSG:3857': 'EPSG:3857',
146-
'EPSG:4326': 'EPSG:4326'
147-
};
148-
const baseProjection = this._getMapProjection(mapInfo);
149-
// 坐标系异常处理
150-
if (!(baseProjection in projectionMap)) {
151-
throw Error(Lang.i18n('msg_crsunsupport'));
152-
}
153-
this.webMapInstance = this._initMap(mapInfo);
154-
this._registerWebMapEvents();
155-
this.webMapInstance.createWebMap(mapInfo);
156-
})
157-
.catch((error) => {
158-
/**
159-
* @event WebMap#getmapfailed
160-
* @description 获取地图信息失败。
161-
* @property {Object} error - 失败原因。
162-
*/
163-
this.fire('getmapfailed', { error: error });
164-
});
165-
}
138+
FetchRequest.get(mapUrl, null, { withCredentials: this.options.withCredentials })
139+
.then((response) => {
140+
return response.json();
141+
})
142+
.then((mapInfo) => {
143+
const projectionMap = ['EPSG:4490', 'EPSG:4214', 'EPSG:4610', 'EPSG:3857', 'EPSG:4326'];
144+
const baseProjection = this._getMapProjection(mapInfo);
145+
// 坐标系异常处理
146+
if (!projectionMap.find(item => item === baseProjection)) {
147+
throw Error(Lang.i18n('msg_crsunsupport'));
148+
}
149+
this.webMapInstance = this._initMap(mapInfo);
150+
this._registerWebMapEvents();
151+
this.webMapInstance.initializeMap(mapInfo);
152+
})
153+
.catch((error) => {
154+
/**
155+
* @event WebMap#getmapfailed
156+
* @description 获取地图信息失败。
157+
* @property {Object} error - 失败原因。
158+
*/
159+
this.fire('getmapfailed', { error: error });
160+
});
161+
}
166162

167-
/**
168-
* @private
169-
* @function WebMap.prototype._getMapProjection
170-
* @param {object} mapInfo - 地图信息。
171-
* @description 获取地图投影。
172-
*/
173-
_getMapProjection(mapInfo) {
174-
if (this._isWebMapV3(mapInfo.version)) {
175-
return mapInfo.crs;
176-
}
177-
return mapInfo.projection;
178-
}
163+
/**
164+
* @private
165+
* @function WebMap.prototype._getMapProjection
166+
* @param {object} mapInfo - 地图信息。
167+
* @description 获取地图投影。
168+
*/
169+
_getMapProjection(mapInfo) {
170+
if (this._isWebMapV3(mapInfo.version)) {
171+
return mapInfo.crs;
172+
}
173+
return mapInfo.projection;
174+
}
179175

180176
/**
181177
* @private
@@ -184,34 +180,41 @@ export class WebMap extends mapboxgl.Evented {
184180
* @description 初始化 WebMap 实例
185181
*/
186182
_initMap(mapInfo) {
187-
const WebMapFactory = this._isWebMapV3(mapInfo.version) ? WebMapV3 : WebMapV2;
188-
const webMapInstance = new WebMapFactory(this.mapId, this.options, this.mapOptions);
189-
webMapInstance.setEventedParent(this);
190-
return webMapInstance;
191-
}
183+
const WebMap = this._getMapFactory(mapInfo.version);
184+
const webMapInstance = new WebMap(this.mapId, this.options, this.mapOptions);
185+
webMapInstance.setEventedParent(this);
186+
return webMapInstance;
187+
}
188+
189+
_getMapFactory(version) {
190+
if (this._isWebMapV3(version)) {
191+
return WebMapV3;
192+
}
193+
return WebMapV2;
194+
}
192195

193196
/**
194197
* @private
195198
* @function WebMap.prototype._registerWebMapEvents
196199
* @description 注册 WebMap 事件
197200
*/
198201
_registerWebMapEvents() {
199-
if (!this.webMapInstance) {
200-
return;
201-
}
202-
this.webMapInstance.on('mapinitialized', () => {
203-
this.map = this.webMapInstance.map;
204-
});
205-
this.webMapInstance.on('addlayerssucceeded', ({ mapparams }) => {
206-
this.mapParams = mapparams;
207-
});
208-
}
202+
if (!this.webMapInstance) {
203+
return;
204+
}
205+
this.webMapInstance.on('mapinitialized', () => {
206+
this.map = this.webMapInstance.map;
207+
});
208+
this.webMapInstance.on('addlayerssucceeded', ({ mapparams }) => {
209+
this.mapParams = mapparams;
210+
});
211+
}
209212

210-
_getWebMapInstance() {
211-
return this.webMapInstance;
212-
}
213+
_getWebMapInstance() {
214+
return this.webMapInstance;
215+
}
213216

214-
_isWebMapV3(version) {
217+
_isWebMapV3(version) {
215218
return version.startsWith('3.');
216-
}
217-
}
219+
}
220+
}

‎src/mapboxgl/mapping/webmap/v2/WebMap.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -74,11 +74,11 @@ export class WebMap extends mapboxgl.Evented {
7474
}
7575

7676
/**
77-
* @function WebMap.prototype.createWebMap
77+
* @function WebMap.prototype.initializeMap
7878
* @description 登陆窗口后添加地图图层。
7979
* @param {Object} mapInfo - map 信息。
8080
*/
81-
createWebMap(mapInfo) {
81+
initializeMap(mapInfo) {
8282
this.baseProjection = mapInfo.projection;
8383
//存储地图的名称以及描述等信息，返回给用户
8484
this.mapParams = {

0 commit comments

Comments
 (0)