Skip to content

Commit 2fe2994

Browse files
xilanhuaweidapaoxilanhuaweidapao
committed
新增对接 地图服务影像栅格图层 gamma 参数，新增创建临时图层示例 review by luox
1 parent b55ceba commit 2fe2994

24 files changed

+495
-7
lines changed

‎examples/leaflet/config.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,13 @@ var exampleConfig = {
121121
version: '11.2.0',
122122
thumbnail: "chart.png",
123123
fileName: "01_chartService"
124+
},
125+
{
126+
name: "创建临时图层",
127+
name_en: "Create temporary layer",
128+
version: '11.3.0',
129+
thumbnail: "createTempLayer.png",
130+
fileName: "createTempLayer"
124131
}
125132
]
126133
},

‎examples/leaflet/createTempLayer.html‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
<!--********************************************************************
2+
* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
3+
*********************************************************************-->
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<meta charset="UTF-8" />
8+
<title data-i18n="resources.title_createTempLayer"></title>
9+
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
10+
</head>
11+
<style>
12+
#toolbar {
13+
position: absolute;
14+
top: 50px;
15+
right: 10px;
16+
width: 300px;
17+
text-align: center;
18+
z-index: 500;
19+
border-radius: 4px;
20+
}
21+
</style>
22+
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
23+
<div id="toolbar" class="panel panel-primary">
24+
<div class="panel-heading">
25+
<h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer"></h5>
26+
</div>
27+
<div class="panel-body content">
28+
<div style="margin-bottom: 5px; text-align: left;">
29+
<span data-i18n="resources.text_gammaParamBounds"></span>
30+
</div>
31+
<div class="panel">
32+
<div class="input-group">
33+
<span class="input-group-addon" data-i18n="resources.text_gamma"></span>
34+
<input id="gammaParam" value="1" class="form-control"></input>
35+
</div>
36+
</div>
37+
<input
38+
type="button"
39+
class="btn btn-default"
40+
data-i18n="[value]resources.text_create"
41+
onclick="createTempLayer()"
42+
/>
43+
</div>
44+
</div>
45+
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
46+
<script type="text/javascript" src="../../dist/leaflet/include-leaflet.js"></script>
47+
<script type="text/javascript">
48+
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
49+
var map,
50+
tempLayer,
51+
url = host + '/iserver/services/map-World/rest/maps/World';
52+
map = L.map('map', {
53+
preferCanvas: true,
54+
crs: L.CRS.EPSG4326,
55+
center: { lon: 0, lat: 0 },
56+
maxZoom: 18,
57+
zoom: 2
58+
});
59+
createTempLayer();
60+
61+
function createTempLayer() {
62+
new L.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
63+
var result = serviceResult.result;
64+
result.subLayers.layers.map(function (layer, index) {
65+
if (index === 15) {
66+
layer.gamma = document.getElementById("gammaParam").value || 1;
67+
result.subLayers.layers = [layer];
68+
new L.supermap.LayerInfoService(url)
69+
.setLayersInfo(
70+
new L.supermap.SetLayersInfoParameters({
71+
layersInfo: result
72+
})
73+
)
74+
.then((res) => {
75+
tempLayer && tempLayer.remove();
76+
tempLayer = new L.supermap.TiledMapLayer(url, {
77+
noWrap: true,
78+
cacheEnabled: false,
79+
transparent: true,
80+
layersID: res.result.newResourceID
81+
})
82+
tempLayer.addTo(map);
83+
});
84+
}
85+
});
86+
});
87+
}
88+
</script>
89+
</body>
90+
</html>

‎examples/leaflet/img/createTempLayer.png‎

46.6 KB
Loading

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

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -814,6 +814,7 @@ window.examplesResources = {
814814
"title_ugcPointPosition": "Point And Line Analysis",
815815
"title_ugcSpatial": "Spacial Analysis",
816816
"title_multiphaseplay": "Multiphase Play",
817+
"title_createTempLayer": "Create Temp Layer",
817818

818819
"text_graphmap_shortest_analysis": "Shortest Path Analysis",
819820
"text_startNode": "start node",
@@ -1696,6 +1697,9 @@ window.examplesResources = {
16961697
"text_queryDistanceLimit": "The query distance must be greater than zero",
16971698
"text_multiphaseplay": "Multiphase Play(2009-2016 years of NDVI)",
16981699
"text_2009To2016NDVI": "2009-2016 years of NDVI",
1700+
"text_create": "Create",
1701+
"text_gamma": "Gamma param",
1702+
"text_gammaParamBounds": "Gamma input bounds is 0 to 10",
16991703

17001704
"btn_previous":"Previous",
17011705
"btn_next":"Next",

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

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -779,6 +779,7 @@ window.examplesResources = {
779779
"title_l7_snow_particle": "雪花粒子",
780780
"title_l7_rain_particle": "雨滴粒子",
781781
"title_multiphaseplay": "多时相播放",
782+
"title_createTempLayer": "创建临时图层",
782783

783784
"text_district_search": "行政区检索",
784785
"text_rectangle_search": "矩形检索",
@@ -1652,6 +1653,9 @@ window.examplesResources = {
16521653
"text_queryDistanceLimit": "查询距离必须大于零",
16531654
"text_multiphaseplay": "多时相播放",
16541655
"text_2009To2016NDVI": "2009-2016年5月植被指数",
1656+
"text_create": "创建",
1657+
"text_gamma": "Gamma 参数",
1658+
"text_gammaParamBounds": "Gamma 数值范围为 0 到 10",
16551659

16561660

16571661

‎examples/mapboxgl/config.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,13 @@ var exampleConfig = {
9090
version: '11.2.0',
9191
thumbnail: "chart.png",
9292
fileName: "01_chartService"
93+
},
94+
{
95+
name: "创建临时图层",
96+
name_en: "Create temporary layer",
97+
version: '11.3.0',
98+
thumbnail: "createTempLayer.png",
99+
fileName: "createTempLayer"
93100
}
94101
]
95102
},

‎examples/mapboxgl/createTempLayer.html‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
<!--********************************************************************
2+
* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
3+
*********************************************************************-->
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<meta charset="UTF-8" />
8+
<title data-i18n="resources.title_createTempLayer"></title>
9+
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
10+
</head>
11+
<style>
12+
#toolbar {
13+
position: absolute;
14+
top: 50px;
15+
right: 10px;
16+
width: 300px;
17+
text-align: center;
18+
z-index: 500;
19+
border-radius: 4px;
20+
}
21+
</style>
22+
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
23+
<div id="toolbar" class="panel panel-primary">
24+
<div class="panel-heading">
25+
<h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer"></h5>
26+
</div>
27+
<div class="panel-body content">
28+
<div style="margin-bottom: 5px; text-align: left;">
29+
<span data-i18n="resources.text_gammaParamBounds"></span>
30+
</div>
31+
<div class="panel">
32+
<div class="input-group">
33+
<span class="input-group-addon" data-i18n="resources.text_gamma"></span>
34+
<input id="gammaParam" value="1" class="form-control"></input>
35+
</div>
36+
</div>
37+
<input
38+
type="button"
39+
class="btn btn-default"
40+
data-i18n="[value]resources.text_create"
41+
onclick="createTempLayer()"
42+
/>
43+
</div>
44+
</div>
45+
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
46+
<script type="text/javascript" src="../../dist/mapboxgl/include-mapboxgl.js"></script>
47+
<span id="show"></span>
48+
<script type="text/javascript">
49+
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
50+
var infowin,
51+
url = host + '/iserver/services/map-World/rest/maps/World';
52+
var map = new mapboxgl.Map({
53+
container: 'map',
54+
style: {
55+
version: 8,
56+
sources: {},
57+
layers: []
58+
},
59+
center: [0, 0],
60+
zoom: 2
61+
});
62+
map.on('load', function () {
63+
createTempLayer();
64+
});
65+
66+
function createTempLayer() {
67+
new mapboxgl.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
68+
var result = serviceResult.result;
69+
result.subLayers.layers.map(function (layer, index) {
70+
if (index === 15) {
71+
layer.gamma = document.getElementById('gammaParam').value || 1;
72+
result.subLayers.layers = [layer];
73+
new mapboxgl.supermap.LayerInfoService(url)
74+
.setLayersInfo(
75+
new mapboxgl.supermap.SetLayersInfoParameters({
76+
layersInfo: result
77+
})
78+
)
79+
.then((res) => {
80+
var result = res.result;
81+
if (result && result.newResourceID) {
82+
if (map.getLayer('layer')) {
83+
map.removeLayer('layer');
84+
map.removeSource('layer');
85+
}
86+
map.addLayer({
87+
id: 'layer',
88+
type: 'raster',
89+
source: {
90+
type: 'raster',
91+
tiles: [
92+
'http://localhost:8090/iserver/services/map-World/rest/maps/World/zxyTileImage.png?z={z}&x={x}&y={y}&transparent=true&cacheEnabled=false&noWrap=true&layersID=' +
93+
result.newResourceID
94+
],
95+
tileSize: 256
96+
}
97+
});
98+
}
99+
});
100+
}
101+
});
102+
});
103+
}
104+
</script>
105+
</body>
106+
</html>

‎examples/mapboxgl/img/createTempLayer.png‎

46.6 KB
Loading

‎examples/maplibregl/config.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,13 @@ var exampleConfig = {
7777
version: '11.2.0',
7878
thumbnail: "chart.png",
7979
fileName: "01_chartService"
80+
},
81+
{
82+
name: "创建临时图层",
83+
name_en: "Create temporary layer",
84+
version: '11.3.0',
85+
thumbnail: "createTempLayer.png",
86+
fileName: "createTempLayer"
8087
}
8188
]
8289
},

‎examples/maplibregl/createTempLayer.html‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
<!--********************************************************************
2+
* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
3+
*********************************************************************-->
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<meta charset="UTF-8" />
8+
<title data-i18n="resources.title_createTempLayer"></title>
9+
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
10+
</head>
11+
<style>
12+
#toolbar {
13+
position: absolute;
14+
top: 50px;
15+
right: 10px;
16+
width: 300px;
17+
text-align: center;
18+
z-index: 500;
19+
border-radius: 4px;
20+
}
21+
</style>
22+
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
23+
<div id="toolbar" class="panel panel-primary">
24+
<div class="panel-heading">
25+
<h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer"></h5>
26+
</div>
27+
<div class="panel-body content">
28+
<div style="margin-bottom: 5px; text-align: left;">
29+
<span data-i18n="resources.text_gammaParamBounds"></span>
30+
</div>
31+
<div class="panel">
32+
<div class="input-group">
33+
<span class="input-group-addon" data-i18n="resources.text_gamma"></span>
34+
<input id="gammaParam" value="1" class="form-control"></input>
35+
</div>
36+
</div>
37+
<input
38+
type="button"
39+
class="btn btn-default"
40+
data-i18n="[value]resources.text_create"
41+
onclick="createTempLayer()"
42+
/>
43+
</div>
44+
</div>
45+
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
46+
<script type="text/javascript" src="../../dist/maplibregl/include-maplibregl.js"></script>
47+
<script type="text/javascript">
48+
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
49+
var url = host + '/iserver/services/map-World/rest/maps/World';
50+
var map = new maplibregl.Map({
51+
container: 'map',
52+
style: {
53+
version: 8,
54+
sources: {},
55+
layers: []
56+
},
57+
center: [0, 0],
58+
zoom: 2
59+
});
60+
createTempLayer();
61+
62+
function createTempLayer() {
63+
new maplibregl.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
64+
var result = serviceResult.result;
65+
result.subLayers.layers.map(function (layer, index) {
66+
if (index === 15) {
67+
layer.gamma = document.getElementById("gammaParam").value || 1;
68+
result.subLayers.layers = [layer];
69+
new maplibregl.supermap.LayerInfoService(url)
70+
.setLayersInfo(
71+
new maplibregl.supermap.SetLayersInfoParameters({
72+
layersInfo: result
73+
})
74+
)
75+
.then((res) => {
76+
var result = res.result;
77+
if (result && result.newResourceID) {
78+
if (map.getLayer('layer')) {
79+
map.removeLayer('layer');
80+
map.removeSource('layer');
81+
}
82+
map.addLayer({
83+
id: 'layer',
84+
type: 'raster',
85+
source: {
86+
type: 'raster',
87+
tiles: [
88+
'http://localhost:8090/iserver/services/map-World/rest/maps/World/zxyTileImage.png?z={z}&x={x}&y={y}&transparent=true&cacheEnabled=false&noWrap=true&layersID=' +
89+
result.newResourceID
90+
],
91+
tileSize: 256
92+
}
93+
});
94+
}
95+
});
96+
}
97+
});
98+
});
99+
}
100+
</script>
101+
</body>
102+
</html>

0 commit comments

Comments
 (0)