Skip to content

Commit

Permalink
优化创建临时图层示例
Browse files Browse the repository at this point in the history
  • Loading branch information
@xilanhuaweidapao
xilanhuaweidapao committed Nov 19, 2024
1 parent 2fe2994 commit 7ab3917
Show file tree
Hide file tree
Showing 4 changed files with 134 additions and 64 deletions.
63 changes: 40 additions & 23 deletions examples/leaflet/createTempLayer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
type="button"
class="btn btn-default"
data-i18n="[value]resources.text_create"
onclick="createTempLayer()"
onclick="updateTempLayer()"
/>
</div>
</div>
Expand All @@ -47,8 +47,11 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
<script type="text/javascript">
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
var map,
layerInfoService,
tempLayer,
url = host + '/iserver/services/map-World/rest/maps/World';
newResourceID,
result,
url = host + '/iserver/services/map-world/rest/maps/World';
map = L.map('map', {
preferCanvas: true,
crs: L.CRS.EPSG4326,
Expand All @@ -60,30 +63,44 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">

function createTempLayer() {
new L.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
var result = serviceResult.result;
result.subLayers.layers.map(function (layer, index) {
if (index === 15) {
layer.gamma = document.getElementById("gammaParam").value || 1;
result.subLayers.layers = [layer];
new L.supermap.LayerInfoService(url)
.setLayersInfo(
result = serviceResult.result;
var layer = result.subLayers.layers[15];
layer.gamma = document.getElementById("gammaParam").value || 1;
result.subLayers.layers = [layer];
layerInfoService = new L.supermap.LayerInfoService(url);
layerInfoService.setLayersInfo(
new L.supermap.SetLayersInfoParameters({
layersInfo: result
})
)
.then((res) => {
newResourceID = res.result.newResourceID;
tempLayer = new L.supermap.TiledMapLayer(url, {
noWrap: true,
cacheEnabled: false,
transparent: true,
layersID: res.result.newResourceID
})
tempLayer.addTo(map);
});
});
}

function updateTempLayer() {
if (!newResourceID) {
return;
}
var layer = result.subLayers.layers[0];
layer.gamma = document.getElementById("gammaParam").value || 1;
layerInfoService.setLayersInfo(
new L.supermap.SetLayersInfoParameters({
layersInfo: result
layersInfo: result,
resourceID: newResourceID,
isTempLayers: true
})
)
.then((res) => {
tempLayer && tempLayer.remove();
tempLayer = new L.supermap.TiledMapLayer(url, {
noWrap: true,
cacheEnabled: false,
transparent: true,
layersID: res.result.newResourceID
})
tempLayer.addTo(map);
).then((res) => {
tempLayer.updateParams();
});
}
});
});
}
</script>
</body>
Expand Down
44 changes: 30 additions & 14 deletions examples/mapboxgl/createTempLayer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
type="button"
class="btn btn-default"
data-i18n="[value]resources.text_create"
onclick="createTempLayer()"
onclick="updateTempLayer()"
/>
</div>
</div>
Expand All @@ -47,8 +47,11 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
<span id="show"></span>
<script type="text/javascript">
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
var infowin,
url = host + '/iserver/services/map-World/rest/maps/World';
var layerInfoService,
tempLayer,
newResourceID,
result,
url = host + '/iserver/services/map-world/rest/maps/World';
var map = new mapboxgl.Map({
container: 'map',
style: {
Expand All @@ -65,24 +68,20 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">

function createTempLayer() {
new mapboxgl.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
var result = serviceResult.result;
result.subLayers.layers.map(function (layer, index) {
if (index === 15) {
result = serviceResult.result;
layer = result.subLayers.layers[15]
layer.gamma = document.getElementById('gammaParam').value || 1;
result.subLayers.layers = [layer];
new mapboxgl.supermap.LayerInfoService(url)
.setLayersInfo(
layerInfoService = new mapboxgl.supermap.LayerInfoService(url)
layerInfoService.setLayersInfo(
new mapboxgl.supermap.SetLayersInfoParameters({
layersInfo: result
})
)
.then((res) => {
var result = res.result;
newResourceID = result.newResourceID;
if (result && result.newResourceID) {
if (map.getLayer('layer')) {
map.removeLayer('layer');
map.removeSource('layer');
}
map.addLayer({
id: 'layer',
type: 'raster',
Expand All @@ -97,10 +96,27 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
});
}
});
}
});
});
}

function updateTempLayer() {
if (!newResourceID) {
return;
}
var layer = result.subLayers.layers[0];
layer.gamma = document.getElementById("gammaParam").value || 1;
layerInfoService.setLayersInfo(
new mapboxgl.supermap.SetLayersInfoParameters({
layersInfo: result,
resourceID: newResourceID,
isTempLayers: true
})
).then((res) => {
map.style.sourceCaches['layer'].clearTiles();
map.style.sourceCaches['layer'].update(map.transform);
map.triggerRepaint();
});
}
</script>
</body>
</html>
49 changes: 34 additions & 15 deletions examples/maplibregl/createTempLayer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,15 +38,19 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
type="button"
class="btn btn-default"
data-i18n="[value]resources.text_create"
onclick="createTempLayer()"
onclick="updateTempLayer()"
/>
</div>
</div>
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
<script type="text/javascript" src="../../dist/maplibregl/include-maplibregl.js"></script>
<script type="text/javascript">
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
var url = host + '/iserver/services/map-World/rest/maps/World';
var layerInfoService,
tempLayer,
newResourceID,
result,
url = host + '/iserver/services/map-world/rest/maps/World';
var map = new maplibregl.Map({
container: 'map',
style: {
Expand All @@ -57,28 +61,26 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
center: [0, 0],
zoom: 2
});
createTempLayer();
map.on('load', function () {
createTempLayer();
});

function createTempLayer() {
new maplibregl.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
var result = serviceResult.result;
result.subLayers.layers.map(function (layer, index) {
if (index === 15) {
layer.gamma = document.getElementById("gammaParam").value || 1;
result = serviceResult.result;
layer = result.subLayers.layers[15]
layer.gamma = document.getElementById('gammaParam').value || 1;
result.subLayers.layers = [layer];
new maplibregl.supermap.LayerInfoService(url)
.setLayersInfo(
layerInfoService = new maplibregl.supermap.LayerInfoService(url)
layerInfoService.setLayersInfo(
new maplibregl.supermap.SetLayersInfoParameters({
layersInfo: result
})
)
.then((res) => {
var result = res.result;
newResourceID = result.newResourceID;
if (result && result.newResourceID) {
if (map.getLayer('layer')) {
map.removeLayer('layer');
map.removeSource('layer');
}
map.addLayer({
id: 'layer',
type: 'raster',
Expand All @@ -93,10 +95,27 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
});
}
});
}
});
});
}

function updateTempLayer() {
if (!newResourceID) {
return;
}
var layer = result.subLayers.layers[0];
layer.gamma = document.getElementById("gammaParam").value || 1;
layerInfoService.setLayersInfo(
new maplibregl.supermap.SetLayersInfoParameters({
layersInfo: result,
resourceID: newResourceID,
isTempLayers: true
})
).then((res) => {
map.style.sourceCaches['layer'].clearTiles();
map.style.sourceCaches['layer'].update(map.transform);
map.triggerRepaint();
});
}
</script>
</body>
</html>
42 changes: 30 additions & 12 deletions examples/openlayers/createTempLayer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
type="button"
class="btn btn-default"
data-i18n="[value]resources.text_create"
onclick="createTempLayer()"
onclick="updateTempLayer()"
/>
</div>
</div>
Expand All @@ -49,8 +49,11 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
<script type="text/javascript">
var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
var tempLayer;
var url = host + '/iserver/services/map-World/rest/maps/World';
var tempLayer,
layerInfoService,
newResourceID,
result;
var url = host + '/iserver/services/map-world/rest/maps/World';
var map = new ol.Map({
target: 'map',
controls: ol.control.defaults
Expand All @@ -67,19 +70,19 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">

function createTempLayer() {
new ol.supermap.LayerInfoService(url).getLayersInfo().then((serviceResult) => {
serviceResult.result.subLayers.layers.map(function (layer, index) {
if (index === 15) {
result = serviceResult.result;
layer = serviceResult.result.subLayers.layers[15];
layer.gamma = document.getElementById("gammaParam").value || 1;
serviceResult.result.subLayers.layers = [layer];
new ol.supermap.LayerInfoService(url)
.setLayersInfo(
result.subLayers.layers = [layer];
layerInfoService = new ol.supermap.LayerInfoService(url);
layerInfoService.setLayersInfo(
new ol.supermap.SetLayersInfoParameters({
layersInfo: serviceResult.result
layersInfo: result
})
)
.then((res) => {
if (res.result && res.result.newResourceID) {
map.removeLayer(tempLayer);
newResourceID = res.result.newResourceID;
tempLayer = new ol.layer.Tile({
source: new ol.source.TileSuperMapRest({
url: url,
Expand All @@ -93,10 +96,25 @@ <h5 class="panel-title text-center" data-i18n="resources.title_createTempLayer">
map.addLayer(tempLayer);
}
});
}
});
});
}

function updateTempLayer() {
if (!newResourceID) {
return;
}
var layer = result.subLayers.layers[0];
layer.gamma = document.getElementById("gammaParam").value || 1;
layerInfoService.setLayersInfo(
new ol.supermap.SetLayersInfoParameters({
layersInfo: result,
resourceID: newResourceID,
isTempLayers: true
})
).then((res) => {
tempLayer.getSource().updateParams();
});
}
</script>
</body>
</html>

0 comments on commit 7ab3917

Please sign in to comment.