Skip to content

Commit d42861c

Browse files
songyumengsongyumeng
committed
openlayers 对接 baidu wms wmts
1 parent b7ac0d1 commit d42861c

File tree

10 files changed

+900
-631
lines changed

10 files changed

+900
-631
lines changed

‎build/deps.js‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -209,7 +209,24 @@ var deps = {
209209
"OL3": {
210210
"OGC": {
211211
"title": "OGC",
212-
"description": "--对接OGC标准服务"
212+
"description": "--对接OGC标准服务",
213+
"WMTS": {
214+
"name": "WMTS服务",
215+
"src": []
216+
},
217+
"WMS": {
218+
"name": "WMS服务",
219+
"src": []
220+
},
221+
},
222+
"mapping": {
223+
"title": "互联网地图",
224+
"description": "--对接互联网地图",
225+
"Baidu": {
226+
"name": "百度图层",
227+
"src": ['./src/OL3/mapping/baidu.js']
228+
},
229+
213230
},
214231
"SuperMap": {
215232
"title": "SuperMap",

‎dist/iclient9-openlayers.js‎

Lines changed: 690 additions & 629 deletions
Large diffs are not rendered by default.

‎examples/openlayers/WMSLayer.html‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>WMTS 图层</title>
6+
<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
7+
<link href="http://cdn.bootcss.com/openlayers/4.0.1/ol.css" rel="stylesheet">
8+
</head>
9+
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%">
10+
<div id="map" style="width: 100%;height:100%;border: 1px solid #dddddd"></div>
11+
</body>
12+
<script src="http://cdn.bootcss.com/openlayers/4.0.1/ol-debug.js"></script>
13+
<script type="text/javascript" src="../../dist/iclient9-openlayers.js"></script>
14+
<script type="text/javascript">
15+
var resolutions = new Array(17);
16+
var matrixIds = new Array(17);
17+
for (var z = 0; z < 17; ++z) {
18+
resolutions[z] = 156543.033928041 / Math.pow(2, z);
19+
matrixIds[z] = z;
20+
}
21+
var map = new ol.Map({
22+
target: 'map',
23+
view: new ol.View({
24+
center: [0, 0],
25+
zoom: 0,
26+
}),
27+
layers: [new ol.layer.Tile({
28+
opacity: 0.7,
29+
source: new ol.source.TileWMS({
30+
url: 'http://support.supermap.com.cn:8090/iserver/services/map-china400/wms111/China',
31+
params: {
32+
'LAYERS': 'China',
33+
'FORMAT': 'image/png'
34+
}
35+
})
36+
})]
37+
});
38+
</script>
39+
</html>

‎examples/openlayers/WMTSLayer.html‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>WMTS 图层</title>
6+
<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
7+
<link href="http://cdn.bootcss.com/openlayers/4.0.1/ol.css" rel="stylesheet">
8+
</head>
9+
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%">
10+
<div id="map" style="width: 100%;height:100%;border: 1px solid #dddddd"></div>
11+
</body>
12+
<script src="http://cdn.bootcss.com/openlayers/4.0.1/ol-debug.js"></script>
13+
<script type="text/javascript" src="../../dist/iclient9-openlayers.js"></script>
14+
<script type="text/javascript">
15+
var resolutions = new Array(17);
16+
var matrixIds = new Array(17);
17+
for (var z = 0; z < 17; ++z) {
18+
resolutions[z] = 156543.033928041 / Math.pow(2, z);
19+
matrixIds[z] = z;
20+
}
21+
var map = new ol.Map({
22+
target: 'map',
23+
view: new ol.View({
24+
center: [0, 0],
25+
zoom: 0,
26+
}),
27+
layers: [new ol.layer.Tile({
28+
opacity: 0.7,
29+
source: new ol.source.WMTS({
30+
url: 'http://support.supermap.com.cn:8090/iserver/services/map-china400/wmts100',
31+
layer: 'China',
32+
matrixSet: 'GoogleMapsCompatible_China',
33+
format: 'image/png',
34+
tileGrid: new ol.tilegrid.WMTS({
35+
origin: [-2.0037508342787E7, 2.0037508342787E7],
36+
resolutions: resolutions,
37+
matrixIds: matrixIds
38+
}),
39+
style: 'default'
40+
})
41+
})]
42+
});
43+
</script>
44+
</html>

‎examples/openlayers/baiduLayer.html‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>百度地图</title>
6+
<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
7+
<link href="http://cdn.bootcss.com/openlayers/4.0.1/ol.css" rel="stylesheet">
8+
</head>
9+
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%">
10+
<div id="map" style="width: 100%;height:100%;border: 1px solid #dddddd"></div>
11+
</body>
12+
<script src="http://cdn.bootcss.com/openlayers/4.0.1/ol-debug.js"></script>
13+
<script type="text/javascript" src="../../dist/iclient9-openlayers.js"></script>
14+
<script type="text/javascript">
15+
var map = new ol.Map({
16+
target: 'map',
17+
view: new ol.View({
18+
center: [0, 0],
19+
zoom: 3,
20+
})
21+
});
22+
var layer = new ol.layer.Tile({
23+
source: new ol.source.Baidu(),
24+
});
25+
map.addLayer(layer);
26+
</script>
27+
</html>

‎examples/openlayers/config.js‎

Lines changed: 31 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -335,6 +335,36 @@ var exampleConfig = {
335335
},
336336
"OGC": {
337337
name: "OGC",
338-
content: null
338+
content: {
339+
"WMTS": {
340+
name: "",
341+
content: [{
342+
name: "WMTS图层",
343+
thumbnail: "ol_WMTSLayer.png",
344+
fileName: "WMTSLayer"
345+
}]
346+
},
347+
"WMS": {
348+
name: "",
349+
content: [{
350+
name: "WMS图层",
351+
thumbnail: "ol_WMSLayer.png",
352+
fileName: "WMSLayer"
353+
}]
354+
}
355+
}
356+
},
357+
"mapping": {
358+
name: "互联网地图",
359+
content: {
360+
"Baidu": {
361+
name: "",
362+
content: [{
363+
name: "百度地图",
364+
thumbnail: "ol_baiduLayer.png",
365+
fileName: "baiduLayer"
366+
}]
367+
}
368+
}
339369
}
340370
}

‎examples/openlayers/img/ol_WMSLayer.png‎

101 KB
Loading

‎examples/openlayers/img/ol_WMTSLayer.png‎

92.7 KB
Loading

‎examples/openlayers/img/ol_baiduLayer.png‎

158 KB
Loading

‎src/OL3/mapping/baidu.js‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
ol.source.Baidu = function (opt_options) {
2+
3+
var options = opt_options || {};
4+
5+
var attributions;
6+
if (options.attributions !== undefined) {
7+
attributions = options.attributions;
8+
} else {
9+
attributions = new ol.Attribution({
10+
html: ' with <a href="http://icltest.supermapol.com/">SuperMap iClient</a>'
11+
});
12+
}
13+
this.tileGrid = ol.source.Baidu.defaultTileGrid();
14+
var crossOrigin = options.crossOrigin !== undefined ?
15+
options.crossOrigin : 'anonymous';
16+
17+
var url = options.url !== undefined ?
18+
options.url : "http://online{1-8}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl&udt=20170408&scaler=1";
19+
20+
ol.source.TileImage.call(this, {
21+
attributions: attributions,
22+
cacheSize: options.cacheSize,
23+
crossOrigin: crossOrigin,
24+
opaque: options.opaque !== undefined ? options.opaque : true,
25+
maxZoom: options.maxZoom !== undefined ? options.maxZoom : 19,
26+
reprojectionErrorThreshold: options.reprojectionErrorThreshold,
27+
tileLoadFunction: options.tileLoadFunction,
28+
url: url,
29+
projection: 'EPSG:3857',
30+
wrapX: options.wrapX
31+
});
32+
ol.source.Baidu.prototype.getTileCoordForTileUrlFunction = function (tileCoord, opt_projection) {
33+
var temp = [tileCoord[0], tileCoord[1], -tileCoord[2] - 1];
34+
return ol.source.TileImage.prototype.getTileCoordForTileUrlFunction.call(this, temp, opt_projection);
35+
};
36+
ol.source.Baidu.prototype.getTileGridForProjection = function (projection) {
37+
return ol.source.Baidu.defaultTileGrid();
38+
}
39+
40+
};
41+
ol.inherits(ol.source.Baidu, ol.source.TileImage);
42+
ol.source.Baidu.defaultTileGrid = function () {
43+
var tileGird = new ol.tilegrid.TileGrid({
44+
extent: ol.tilegrid.extentFromProjection("EPSG:3857"),
45+
resolutions: [131072 * 2, 131072, 65536, 32768, 16284, 8192, 4096, 2048, 1024, 512, 256, 128, 64, 32, 16, 8, 4, 2, 1, 0.5],
46+
origin: [0, 0],
47+
minZoom: 3,
48+
49+
})
50+
return tileGird;
51+
}

0 commit comments

Comments
 (0)