Skip to content

Commit 41d2d76

Browse files
songyumengsongyumeng
committed
【fix】修复leaflet 天地图layer noWrap参数无效的问题
1 parent e68d377 commit 41d2d76

File tree

5 files changed

+79
-34
lines changed

5 files changed

+79
-34
lines changed

‎src/leaflet/core/ExtendsCRS.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -36,12 +36,15 @@ for (let i = 1; i < 19; i++) {
3636
export var TianDiTu_WGS84CRS = L.CRS.TianDiTu_WGS84 = L.Proj.CRS("EPSG:4326",{
3737
origin: [-180, 90],
3838
resolutions: tdt_WGS84_resolutions,
39-
bounds: L.bounds([-180, -90], [180, 90])
39+
bounds: L.bounds([-180, -90], [180, 90]),
40+
wrapLng: [-180, 180]
4041
});
4142

43+
const c = Math.PI * 2 * 6378137;
44+
const halfC = c / 2;
4245
var tdt_Mercator_resolutions = [];
4346
for (let i = 1; i < 19; i++) {
44-
tdt_Mercator_resolutions.push(78271.5169640203125 * 2 / (Math.pow(2, i)));
47+
tdt_Mercator_resolutions.push(c / 256 / Math.pow(2, i));
4548
}
4649

4750
/**
@@ -50,11 +53,12 @@ for (let i = 1; i < 19; i++) {
5053
* @category BaseTypes Projection
5154
* @namespace
5255
*/
53-
export var TianDiTu_MercatorCRS = L.CRS.TianDiTu_Mercator = L.Proj.CRS("EPSG:3857",{
54-
origin: [-20037508.3427892, 20037508.3427892],
56+
export var TianDiTu_MercatorCRS = (L.CRS.TianDiTu_Mercator = L.Proj.CRS('EPSG:3857', {
57+
origin: [-halfC, halfC],
5558
resolutions: tdt_Mercator_resolutions,
56-
bounds: L.bounds([-20037508.3427892, -20037508.3427892], [20037508.3427892, 20037508.3427892])
57-
});
59+
bounds: L.bounds([-halfC, -halfC], [halfC, halfC]),
60+
wrapLng: [-180, 180]
61+
}));
5862
L.CRS.BaiduCRS = BaiduCRS;
5963
L.CRS.TianDiTu_WGS84CRS = TianDiTu_WGS84CRS;
6064
L.CRS.TianDiTu_MercatorCRS = TianDiTu_MercatorCRS;

‎src/leaflet/core/Proj4Leaflet.js

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,15 @@ L.Proj._isProj4Obj = function(a) {
2626
* @param {L.bounds} bounds - 投影范围参数
2727
*/
2828
L.Proj.Projection = L.Class.extend({
29-
initialize: function(code, def, bounds) {
29+
initialize: function(code, def, bounds, wrapLng) {
3030
var isP4 = L.Proj._isProj4Obj(code);
3131
this._proj = isP4 ? code : this._projFromCodeDef(code, def);
3232
var boundsOption = bounds;
3333
if (L.Util.isArray(bounds)) {
3434
boundsOption = L.bounds(bounds);
3535
}
3636
this.bounds = isP4 ? def : boundsOption;
37+
this.wrapLng = wrapLng;
3738
},
3839

3940
/**
@@ -54,8 +55,8 @@ L.Proj.Projection = L.Class.extend({
5455
* @param {number} unbounded - 坐标点高程值等。
5556
* @returns {L.LatLng} 返回经纬度坐标
5657
*/
57-
unproject: function(point, unbounded) {
58-
if (this.bounds) {
58+
unproject: function(point, zoom) {
59+
if (this.bounds && !this.wrapLng) {
5960
point.x =
6061
point.x < this.bounds.min.x
6162
? this.bounds.min.x
@@ -70,7 +71,7 @@ L.Proj.Projection = L.Class.extend({
7071
: point.y;
7172
}
7273
var point2 = this._proj.inverse([point.x, point.y]);
73-
return new L.LatLng(point2[1], point2[0], unbounded);
74+
return new L.LatLng(point2[1], point2[0], zoom);
7475
},
7576

7677
_projFromCodeDef: function(code, def) {
@@ -111,6 +112,7 @@ L.Proj.Projection = L.Class.extend({
111112
* @param {Array.<number>} [options.resolutions] - 分辨率数组。
112113
* @param {(Array.<number>|L.Bounds)} [options.bounds] - 范围。
113114
* @param {number} [options.dpi=96] - dpi。
115+
* @param {number} [options.wrapLng] - 定义经度（水平）坐标轴是否在给定范围内环绕。大多数情况下默认为[-180，180]。
114116
* @example
115117
* var crs =L.Proj.CRS("EPSG:4326",{
116118
* origin: [-180,90],
@@ -136,15 +138,18 @@ export var CRS = L.Class.extend({
136138
code = proj.srsCode;
137139
options = options || {};
138140

139-
this.projection = new L.Proj.Projection(proj, options.bounds);
141+
this.projection = new L.Proj.Projection(proj, options.bounds,options.wrapLng);
140142
} else {
141143
code = srsCode;
142144
options = options || {};
143145
def = options.def || '';
144-
this.projection = new L.Proj.Projection(code, def, options.bounds);
146+
this.projection = new L.Proj.Projection(code, def, options.bounds,options.wrapLng);
145147
}
146148

147149
L.Util.setOptions(this, options);
150+
if (this.options.wrapLng) {
151+
this.wrapLng = this.options.wrapLng;
152+
}
148153
this.code = code;
149154
this.transformation = this.options.transformation;
150155
this.options.dpi = this.options.dpi || 96;

‎src/leaflet/mapping/TiandituTileLayer.js

Lines changed: 40 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
11
/* Copyright© 2000 - 2020 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 {
7-
WMTSLayer
8-
} from "./TileLayer.WMTS";
9-
import Attributions from '../core/Attributions'
4+
import L from 'leaflet';
5+
import '../core/Base';
6+
import { WMTSLayer } from './TileLayer.WMTS';
7+
import Attributions from '../core/Attributions';
108

119
/**
1210
* @class L.supermap.tiandituTileLayer
@@ -22,30 +20,35 @@ import Attributions from '../core/Attributions'
2220
* @param {boolean} [options.isLabel=false] - 是否是标注图层。
2321
* @param {Array.<number>} [options.subdomains=[0, 1, 2, 3, 4, 5, 6, 7]] - 子域名数组。
2422
* @param {string} [options.attribution='Map Data <a href='https://www.tianditu.gov.cn' target='_blank'><img style='background-color:transparent;bottom:2px;opacity:1;' src='https://api.tianditu.gov.cn/img/map/logo.png' width='53px' height='22px' opacity='0'></a>'] - 版权信息
23+
* @param {string} [options.noWrap=true] - 图层是否X方向平铺。
2524
*/
2625
export var TiandituTileLayer = WMTSLayer.extend({
27-
2826
layerLabelMap: {
29-
"vec": "cva",
30-
"ter": "cta",
31-
"img": "cia"
27+
vec: 'cva',
28+
ter: 'cta',
29+
img: 'cia'
3230
},
3331
layerZoomMap: {
34-
"vec": 18,
35-
"ter": 14,
36-
"img": 18
32+
vec: 18,
33+
ter: 14,
34+
img: 18
3735
},
3836
options: {
39-
layerType: "vec", //(vec:矢量图层，vec:矢量标签图层，img:影像图层,cia:影像标签图层，ter:地形,cta:地形标签图层)
37+
layerType: 'vec', //(vec:矢量图层，vec:矢量标签图层，img:影像图层,cia:影像标签图层，ter:地形,cta:地形标签图层)
4038
isLabel: false,
4139
attribution: Attributions.Tianditu.attribution,
42-
url: "https://t{s}.tianditu.gov.cn/{layer}_{proj}/wmts?",
40+
url: 'https://t{s}.tianditu.gov.cn/{layer}_{proj}/wmts?',
4341
zoomOffset: 1,
44-
key: "",
42+
key: '',
4543
dpi: 96,
46-
style: "default",
47-
format: "tiles",
48-
subdomains: [0, 1, 2, 3, 4, 5, 6, 7]
44+
style: 'default',
45+
format: 'tiles',
46+
subdomains: [0, 1, 2, 3, 4, 5, 6, 7],
47+
bounds: [
48+
[-90, -180],
49+
[90, 180]
50+
],
51+
noWrap: true
4952
},
5053

5154
initialize: function (options) {
@@ -63,10 +66,27 @@ export var TiandituTileLayer = WMTSLayer.extend({
6366
this.options.tilematrixSet = map.options.crs.code === "EPSG:4326" ? "c" : "w";
6467
this._url = this._url.replace("{layer}", this.options.layer).replace("{proj}", this.options.tilematrixSet);
6568
WMTSLayer.prototype.onAdd.call(this, map);
69+
},
70+
_isValidTile: function (coords) {
71+
const crs = this._map.options.crs;
72+
if (!crs.infinite) {
73+
const bounds = this._globalTileRange;
74+
if (
75+
((!crs.wrapLng || this.options.noWrap) && (coords.x < bounds.min.x || coords.x > bounds.max.x)) ||
76+
(!crs.wrapLat && (coords.y < bounds.min.y || coords.y > bounds.max.y))
77+
) {
78+
return false;
79+
}
80+
}
81+
if (!this.options.bounds) {
82+
return true;
83+
}
84+
const tileBounds = this._tileCoordsToBounds(coords);
85+
return L.latLngBounds(this.options.bounds).overlaps(tileBounds);
6686
}
6787
});
6888
export var tiandituTileLayer = function (options) {
6989
return new TiandituTileLayer(options);
7090
};
7191

72-
L.supermap.tiandituTileLayer = tiandituTileLayer;
92+
L.supermap.tiandituTileLayer = tiandituTileLayer;

‎src/leaflet/mapping/TileLayer.WMTS.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import "../core/Base";
2121
* @param {Array.<L.supermap.wmtsLayer.matrix>} [options.matrixIds] - 瓦片矩阵对象。不设置时，默认为获取当前级别为tilematrix参数。
2222
* @param {string} [options.version='1.0.0'] - 版本。
2323
* @param {string} [options.attribution] - 版权信息。
24+
* @param {string} [options.noWrap=true] - 图层是否X方向平铺。
2425
*/
2526
/**
2627
* @typedef {Object} L.supermap.wmtsLayer.matrix
@@ -38,7 +39,8 @@ export var WMTSLayer = L.TileLayer.extend({
3839
matrixIds: null,
3940
layer: '',
4041
requestEncoding: 'KVP',
41-
attribution: ''
42+
attribution: '',
43+
noWrap: true
4244
},
4345

4446
//todo 自动获取Capabilities
@@ -65,6 +67,7 @@ export var WMTSLayer = L.TileLayer.extend({
6567

6668
opt.requestEncoding = "KVP";
6769
}
70+
6871
},
6972

7073
/**

‎test/leaflet/mapping/TiandituTileLayerSpec.js

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ describe('leaflet_TiandituTileLayer', () => {
1010
testDiv.style.styleFloat = 'left';
1111
testDiv.style.marginLeft = '8px';
1212
testDiv.style.marginTop = '50px';
13-
testDiv.style.width = '500px';
13+
testDiv.style.width = '1500px';
1414
testDiv.style.height = '500px';
1515
mockCreateTile();
1616
document.body.appendChild(testDiv);
@@ -147,4 +147,17 @@ describe('leaflet_TiandituTileLayer', () => {
147147
'https://t0.tianditu.gov.cn/cia_w/wmts?tk=123456&service=WMTS&request=GetTile&version=1.0.0&style=default&tilematrixSet=w&format=tiles&width=256&height=256&layer=cia&tilematrix=2&tilerow=0&tilecol=0'
148148
);
149149
});
150+
it('initialize_noWrap_false', () => {
151+
var coords = { x: 0, y: 0, z: 0 };
152+
layer = tiandituTileLayer({
153+
layerType: 'img',
154+
isLabel: true,
155+
noWrap:false,
156+
key: '123456'
157+
}).addTo(map);
158+
expect(layer.getTileUrl(coords)).toBe(
159+
'https://t0.tianditu.gov.cn/cia_w/wmts?tk=123456&service=WMTS&request=GetTile&version=1.0.0&style=default&tilematrixSet=w&format=tiles&width=256&height=256&layer=cia&tilematrix=2&tilerow=0&tilecol=0'
160+
);
161+
expect( document.querySelectorAll('.leaflet-tile').length).toBeGreaterThan(4);
162+
});
150163
});

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