setVisibleLayers

最新推荐文章于 2022-07-26 23:23:13 发布

abigflower

最新推荐文章于 2022-07-26 23:23:13 发布

阅读量1.5k

点赞数

本文介绍如何使用ArcGIS API实现地图中图层的动态显示与隐藏功能。通过JavaScript编程，可以创建一个用户界面来控制ArcGISDynamicMapServiceLayer中的各图层可见性，并在用户勾选时即时更新地图显示。

摘要由CSDN通过智能技术生成

ArcGISDynamicMapServiceLayer 中的 setVisibleLayers 函数

例子功能

1. 显示一个底图

2. 叠加一个专题图，专题图下面有很多个空间图层。

3.在界面上动态显示空间图层的名称和复选框，点击复选框，关闭或者显示对应图层

[html] view plain copy

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css"><script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/"></script>
<script type="text/javascript">
dojo.require("esri.map");
var map,visible = [];
var layer , layer2;
function init() {
dojo.require("esri.layers.FeatureLayer");
dojo.style(dojo.byId("map"), { width: dojo.contentBox("map").w + "px", height: (esri.documentBox.h - dojo.contentBox("loginTable").h - 40) + "px" });
map = new esri.Map("map");
layer = new esri.layers.ArcGISTiledMapServiceLayer("http://1.1.1.1/arcgis/rest/services/V32/androidbase/MapServer");
map.addLayer(layer);
layer2 = new esri.layers.ArcGISDynamicMapServiceLayer("http://1.1.1.1/arcgis/rest/services/V32/androidtraffic/MapServer");
if (layer2.loaded) {
buildLayerList(layer2);
}
else {
dojo.connect(layer2, "onLoad", buildLayerList);
}
}
function buildLayerList(layer) {
var infos = layer.layerInfos, info;
var items = [];
console.debug(infos.length);
for (var i=0, il=infos.length; i<il; i++) {
info = infos[i];
console.debug(info);
if (info.defaultVisibility) {
visible.push(info.id);
console.debug("visible is "+visible);
}
items[i] = "<input type='checkbox' class='list_item' checked='" + (info.defaultVisibility ? "checked" : "") + "' id='" + info.id + "' onclick='updateLayerVisibility();' /><label for='" + info.id + "'>" + info.name + "</label>";
}
dojo.byId("layer_list").innerHTML = items.join();
console.debug (items);
layer2.setVisibleLayers(visible);
map.addLayer(layer2);
}
function updateLayerVisibility() {
var inputs = dojo.query(".list_item"), input;
visible = [];
for (var i=0, il=inputs.length; i<il; i++) {
if (inputs[i].checked) {
visible.push(inputs[i].id);
}
}
// 这段代码是在所有的图层都不需要显示的时候，要把这个参数至成-1 ，否则如果为空得数组的话，会全部都显示了。
if(visible.length === 0){
visible.push(-1);
}
layer2.setVisibleLayers(visible);
}
dojo.addOnLoad(init);
</script>
</head>
<body class="tundra">
<table id="loginTable" width="100%">
<br />
Layer List : <span id="layer_list"></span><br />
<br />
</table>
<div id="map" style="margin-left:10px;margin-right:10px;width:97%;border:1px solid #000;"></div>
<div>
</div>
</body>
</html>