隐藏或者显示一个gis服务中的各个图层的显示

最新推荐文章于 2024-03-18 20:32:47 发布

原创最新推荐文章于 2024-03-18 20:32:47 发布 · 1.4w 阅读

4 ·

CC 4.0 BY-SA版权

Arcgis WebGis 专栏收录该内容

29 篇文章

订阅专栏

主要 api是

ArcGISDynamicMapServiceLayer 中的 setVisibleLayers 函数

例子功能

1. 显示一个底图

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

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

<!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>