Skip to content

Commit bf878bf

Browse files
songyumengsongyumeng
committed
【feature】L.supermap.tiledMapLayer 支持设置overflowTiles控制额外渲染的瓦片圈数
1 parent ec985fd commit bf878bf

File tree

2 files changed

+244
-77
lines changed

2 files changed

+244
-77
lines changed

‎src/leaflet/mapping/TiledMapLayer.js

Lines changed: 84 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,15 @@
11
/* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
22
* This program are made available under the terms of the Apache License, Version 2.0
33
* which accompanies this distribution and is available at http://www.apache.org/licenses/LICENSE-2.0.html.*/
4-
import L from 'leaflet';
5-
import '../core/Base';
6-
import { SecurityManager } from '@supermapgis/iclient-common/security/SecurityManager';
7-
import { ServerGeometry } from '@supermapgis/iclient-common/iServer/ServerGeometry';
8-
import { Unit } from '@supermapgis/iclient-common/REST';
9-
import { Util as CommonUtil } from '@supermapgis/iclient-common/commontypes/Util';
10-
11-
import * as Util from '../core/Util';
12-
import Attributions from '../core/Attributions';
4+
import L from 'leaflet';
5+
import '../core/Base';
6+
import { SecurityManager } from '@supermapgis/iclient-common/security/SecurityManager';
7+
import { ServerGeometry } from '@supermapgis/iclient-common/iServer/ServerGeometry';
8+
import { Unit } from '@supermapgis/iclient-common/REST';
9+
import { Util as CommonUtil } from '@supermapgis/iclient-common/commontypes/Util';
1310

11+
import * as Util from '../core/Util';
12+
import Attributions from '../core/Attributions';
1413
/**
1514
* @class TiledMapLayer
1615
* @deprecatedclassinstance L.supermap.tiledMapLayer
@@ -41,12 +40,12 @@
4140
* @param {string} [options.attribution='Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' title='SuperMap iServer' target='_blank'>SuperMap iServer</a></span>'] - 版权描述信息。
4241
* @param {Array.<number>} [options.subdomains] - 子域名数组。
4342
* @param {ChartSetting} [options.chartSetting] - 海图显示参数设置类，用于管理海图显示环境，包括海图的显示模式、显示类型名称、颜色模式、安全水深线等各种显示风格。
43+
* @param {number} [options.overflowTiles = 0] - 绘制超出图层范围的瓦片圈数。常用于位于地图边缘的要素符号显示不全的场景。默认值为0，表示不绘制超出图层范围的瓦片。当 options.noWrap 为 true 时，overflowTiles有效。
4444
* @fires TiledMapLayer#tilesetsinfoloaded
4545
* @fires TiledMapLayer#tileversionschanged
4646
* @usage
4747
*/
4848
export var TiledMapLayer = L.TileLayer.extend({
49-
5049
options: {
5150
//如果有layersID，则是在使用专题图
5251
layersID: null,
@@ -68,9 +67,10 @@ export var TiledMapLayer = L.TileLayer.extend({
6867
crs: null,
6968
format: 'png',
7069
//启用托管地址。
71-
tileProxy:null,
70+
tileProxy: null,
7271
attribution: Attributions.Common.attribution,
73-
subdomains: null
72+
subdomains: null,
73+
overflowTiles: 0
7474
},
7575

7676
initialize: function (url, options) {
@@ -94,7 +94,52 @@ export var TiledMapLayer = L.TileLayer.extend({
9494
this._crs = this.options.crs || map.options.crs;
9595
L.TileLayer.prototype.onAdd.call(this, map);
9696
},
97+
/**
98+
* @override
99+
* @private
100+
*/
101+
_resetGrid: function () {
102+
L.TileLayer.prototype._resetGrid.call(this);
103+
const overflowTiles = this.options.overflowTiles;
104+
if (this._globalTileRange && overflowTiles && this.options.noWrap) {
105+
this._globalTileRange.min = this._globalTileRange.min.subtract([overflowTiles, overflowTiles]);
106+
this._globalTileRange.max = this._globalTileRange.max.add([overflowTiles, overflowTiles]);
107+
}
108+
if (this.options.bounds && this.options.noWrap && overflowTiles) {
109+
const bounds = L.latLngBounds(this.options.bounds);
110+
const sw = bounds.getSouthWest();
111+
const ne = bounds.getNorthEast();
112+
this._boundsTileRange = this._pxBoundsToTileRange(L.bounds(this._crs.latLngToPoint(sw, this._tileZoom), this._crs.latLngToPoint(ne, this._tileZoom)));
113+
this._boundsTileRange.min = this._boundsTileRange.min.subtract([overflowTiles, overflowTiles]);
114+
this._boundsTileRange.max = this._boundsTileRange.max.add([overflowTiles, overflowTiles]);
97115

116+
}
117+
},
118+
/**
119+
* @override
120+
* @private
121+
*/
122+
_isValidTile: function (coords) {
123+
const crs = this._map.options.crs;
124+
if (!crs.infinite) {
125+
const bounds = this._globalTileRange;
126+
if (
127+
((!crs.wrapLng || this.options.noWrap) && (coords.x < bounds.min.x || coords.x > bounds.max.x)) ||
128+
(!crs.wrapLat && (coords.y < bounds.min.y || coords.y > bounds.max.y))
129+
) {
130+
return false;
131+
}
132+
}
133+
if (!this.options.bounds) {
134+
return true;
135+
}
136+
if (this._boundsTileRange && this.options.noWrap) {
137+
return coords.x >= this._boundsTileRange.min.x && coords.x <= this._boundsTileRange.max.x && coords.y >= this._boundsTileRange.min.y && coords.y <= this._boundsTileRange.max.y;
138+
} else {
139+
var tileBounds = this._tileCoordsToBounds(coords);
140+
return L.latLngBounds(this.options.bounds).overlaps(tileBounds);
141+
}
142+
},
98143
/**
99144
* @function TiledMapLayer.prototype.getTileUrl
100145
* @description 根据行列号获取瓦片地址。
@@ -104,16 +149,16 @@ export var TiledMapLayer = L.TileLayer.extend({
104149
getTileUrl: function (coords) {
105150
var scale = this.getScaleFromCoords(coords);
106151
var layerUrl = this._getLayerUrl();
107-
var tileUrl = layerUrl + "&scale=" + scale + "&x=" + coords.x + "&y=" + coords.y;
152+
var tileUrl = layerUrl + '&scale=' + scale + '&x=' + coords.x + '&y=' + coords.y;
108153
//支持代理
109154
if (this.options.tileProxy) {
110155
tileUrl = this.options.tileProxy + encodeURIComponent(tileUrl);
111156
}
112157
if (!this.options.cacheEnabled) {
113-
tileUrl += "&_t=" + new Date().getTime();
158+
tileUrl += '&_t=' + new Date().getTime();
114159
}
115160
if (this.options.subdomains) {
116-
tileUrl = L.Util.template(tileUrl, {s: this._getSubdomain(coords)});
161+
tileUrl = L.Util.template(tileUrl, { s: this._getSubdomain(coords) });
117162
}
118163
return tileUrl;
119164
},
@@ -165,10 +210,7 @@ export var TiledMapLayer = L.TileLayer.extend({
165210
var ne = crs.project(tileBounds.getNorthEast());
166211
var sw = crs.project(tileBounds.getSouthWest());
167212
var tileSize = me.options.tileSize;
168-
var resolution = Math.max(
169-
Math.abs(ne.x - sw.x) / tileSize,
170-
Math.abs(ne.y - sw.y) / tileSize
171-
);
213+
var resolution = Math.max(Math.abs(ne.x - sw.x) / tileSize, Math.abs(ne.y - sw.y) / tileSize);
172214
var mapUnit = Unit.METER;
173215
if (crs.code) {
174216
var array = crs.code.split(':');
@@ -181,7 +223,6 @@ export var TiledMapLayer = L.TileLayer.extend({
181223
}
182224
},
183225

184-
185226
/**
186227
* @function TiledMapLayer.prototype.setTileSetsInfo
187228
* @description 设置瓦片集信息。
@@ -275,7 +316,7 @@ export var TiledMapLayer = L.TileLayer.extend({
275316
*/
276317
mergeTileVersionParam: function (version) {
277318
if (version) {
278-
this.requestParams["tileversion"] = version;
319+
this.requestParams['tileversion'] = version;
279320
this._paramsChanged = true;
280321
this.redraw();
281322
this._paramsChanged = false;
@@ -288,11 +329,11 @@ export var TiledMapLayer = L.TileLayer.extend({
288329
* @description 更新参数。
289330
* @param {Object} params - 参数对象。
290331
*/
291-
updateParams: function(params) {
292-
Object.assign(this.requestParams, params);
293-
this._paramsChanged = true;
294-
this.redraw();
295-
this._paramsChanged = false;
332+
updateParams: function (params) {
333+
Object.assign(this.requestParams, params);
334+
this._paramsChanged = true;
335+
this.redraw();
336+
this._paramsChanged = false;
296337
},
297338

298339
_getLayerUrl: function () {
@@ -320,60 +361,60 @@ export var TiledMapLayer = L.TileLayer.extend({
320361
if (!(tileSize instanceof L.Point)) {
321362
tileSize = L.point(tileSize, tileSize);
322363
}
323-
params["width"] = tileSize.x;
324-
params["height"] = tileSize.y;
364+
params['width'] = tileSize.x;
365+
params['height'] = tileSize.y;
325366

326-
params["redirect"] = options.redirect === true;
327-
params["transparent"] = options.transparent === true;
328-
params["cacheEnabled"] = !(options.cacheEnabled === false);
367+
params['redirect'] = options.redirect === true;
368+
params['transparent'] = options.transparent === true;
369+
params['cacheEnabled'] = !(options.cacheEnabled === false);
329370

330371
if (options.prjCoordSys) {
331-
params["prjCoordSys"] = JSON.stringify(options.prjCoordSys);
372+
params['prjCoordSys'] = JSON.stringify(options.prjCoordSys);
332373
}
333374

334375
if (options.layersID) {
335-
params["layersID"] = options.layersID.toString();
376+
params['layersID'] = options.layersID.toString();
336377
}
337378

338379
if (options.clipRegionEnabled && options.clipRegion) {
339380
options.clipRegion = ServerGeometry.fromGeometry(Util.toSuperMapGeometry(options.clipRegion));
340-
params["clipRegionEnabled"] = options.clipRegionEnabled;
341-
params["clipRegion"] = JSON.stringify(options.clipRegion);
381+
params['clipRegionEnabled'] = options.clipRegionEnabled;
382+
params['clipRegion'] = JSON.stringify(options.clipRegion);
342383
}
343384

344385
//切片的起始参考点，默认为地图范围的左上角。
345386
var crs = me._crs;
346387
if (crs.options && crs.options.origin) {
347-
params["origin"] = JSON.stringify({
388+
params['origin'] = JSON.stringify({
348389
x: crs.options.origin[0],
349390
y: crs.options.origin[1]
350391
});
351392
} else if (crs.projection && crs.projection.bounds) {
352393
var bounds = crs.projection.bounds;
353394
var tileOrigin = L.point(bounds.min.x, bounds.max.y);
354-
params["origin"] = JSON.stringify({
395+
params['origin'] = JSON.stringify({
355396
x: tileOrigin.x,
356397
y: tileOrigin.y
357398
});
358399
}
359400

360401
if (options.overlapDisplayed === false) {
361-
params["overlapDisplayed"] = false;
402+
params['overlapDisplayed'] = false;
362403
if (options.overlapDisplayedOptions) {
363-
params["overlapDisplayedOptions"] = options.overlapDisplayedOptions;
404+
params['overlapDisplayedOptions'] = options.overlapDisplayedOptions;
364405
}
365406
} else {
366-
params["overlapDisplayed"] = true;
407+
params['overlapDisplayed'] = true;
367408
}
368409

369410
if (params.cacheEnabled === true && options.tileversion) {
370-
params["tileversion"] = options.tileversion.toString();
411+
params['tileversion'] = options.tileversion.toString();
371412
}
372413
if (options.rasterfunction) {
373-
params["rasterfunction"] = JSON.stringify(options.rasterfunction);
414+
params['rasterfunction'] = JSON.stringify(options.rasterfunction);
374415
}
375416
if (options.chartSetting) {
376-
params["chartSetting"] = JSON.stringify(options.chartSetting);
417+
params['chartSetting'] = JSON.stringify(options.chartSetting);
377418
}
378419

379420
return params;

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy