描述

本例循环地图服务里的所有图层并增加每个图层到一个带checkbox的列表，checkbox能设置图层的显示或隐藏。动态创建列表的优势是所有的图层都会包含在列表中，即使服务器管理员删除或增加了图层。如果不想包含所有图层，仅仅要一个子集，见示例 Explicitly create layer list。

注意本例在建立图层列表以前检查图层是否被完全加载。

函数buildLayerList()循环访问每个图层并作为一个HTML checkbox加入列表。该函数建立了一个图层列表。默认每个图层的可见行被保存在列表中。

每当某人选择或不选checkbox，函数updateLayerVisibility()被调用。 函数循环访问列表中的每个图层，记录哪些图层是可见的数组，然后调用ArcGISDynamicMapServiceLayer.setVisibleLayers()方法。地图服务里的地图数组可以通过这个方法被设置。

 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

 <html>

   <head>

     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <meta http-equiv="X-UA-Compatible" content="IE=7" />

     <title>动态创建图层列表</title>

     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css">

     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>

     <script type="text/javascript">

         dojo.require("esri.map");

         var dynamicMapServiceLayer,map,visible = [];

         function init() {

             map = new esri.Map("map");

             dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(

                 "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer"

             );

             if (dynamicMapServiceLayer.loaded) {

                 buildLayerList(dynamicMapServiceLayer);

             }else{

                 dojo.connect(dynamicMapServiceLayer,"onLoad",buildLayerList);

             }

         }

         function buildLayerList(layer) {

             var infos = layer.layerInfos, info;

             var items = [];

             for (var i=0,j=infos.length;i<j;i++) {

                 info = infos[i];

                 if (info.defaultVisibility) {

                     visible.push(info.id);

                 }

                 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();

             layer.setVisibleLayers(visible);

             map.addLayer(layer);

         }

         function updateLayerVisibility() {

             var inputs = dojo.query(".list_item"), input;

             visible = [];

             for (var i=0,j=inputs.length;i<j;i++) {

                 if(inputs[i].checked) {

                     visible.push(inputs[i].id);

                 }

             }

             dynamicMapServiceLayer.setVisibleLayers(visible);

         }

         dojo.addOnLoad(init);

     </script>

   </head>

   <body >

       This sample loads an ArcGISDynamicMapServiceLayer.<br />

     It determines the layers in the map service and presents them as checkboxes that can be used to toggle their visibility.<br />

     <br />

       Layer List: <span id="layer_list"></span><br />

       <br />

       <div id="map" class="tundra" style="width: 900px;height: 600px;border: 1px solid #000"></div>

   </body>

 </html>

ArcGIS api for javascript——动态创建图层列表的更多相关文章

  1. ArcGIS api for javascript——使用图层定义显示地图

    描述 本例展示如何使用图层定义来限制显示在地图上的图层信息.为了了解本例做了什么,看看用于这个地图的ESRI_Census_USA服务的服务目录页是有帮助的.检查地图中的图层列表.现在注意这行代码限制 ...

  2. ArcGIS api for javascript——明确的创建图层列表

    描述 本例展示了如何确切地创建一个地图服务里的图层列表.这个列表由HTML checkboxe组成,可用用于开关图层的可见性. 函数updateLayerVisibility()包含开关图层的逻辑.函 ...

  3. ArcGIS API for JavaScript（2）-ArcGIS Server发布要素图层服务

    1.前言 上一篇该系列的文章我们主要讲了一下基础Web地图搭建,这篇我们主要讲一下ArcGIS Server发布服务,并且如何调用服务.将自己的数据加载到Web地图当中来,实现Web端浏览数据. 2. ...

  4. 转：ArcGIS API For JavaScript官方文档（二十）之图形和要素图层——①Graphics概述

    原文地址:ArcGIS API For JavaScript官方文档(二十)之图形和要素图层——①Graphics概述 ArcGIS JavaScript API允许在地图上绘制graphic(图形) ...

  5. 创建ArcGIS API for JavaScript的第一个示例程序

    原文:创建ArcGIS API for JavaScript的第一个示例程序 在上一篇博客中已经介绍了如何搭建ArcGIS API for JavaScript开发环境,如果您还没有搭建好开发环境的话 ...

  6. arcgis api for JavaScript _加载三维图层(scene layer)

    arcgis api for JavaScript _加载三维图层(scene layer) arcgis api for JavaScript  4.x 版本增加对三维的支持. 关于三维图层(sce ...

  7. ArcGIS API for JavaScript介绍

    ArcGIS API for JavaScript中的类是按照模块组织的,主要包含esri.esri/geometry.esri/renderers.esri/symbols.esri/symbols ...

  8. ArcGIS API for JavaScript 4.2学习笔记[5] 官方API大章节概述与内容转译

    内容如上,截图自ESRI官网,连接:ArcGIS API for JavaScript 4.2 [Get Started] 类似于绪论一样的东西,抽取了最需要关注的几个例子.如:加载Map和View, ...

  9. ArcGIS API for JavaScript 4.2学习笔记[0] AJS4.2概述、新特性、未来产品线计划与AJS笔记目录

    放着好好的成熟的AJS 3.19不学,为什么要去碰乳臭未干的AJS 4.2? 4.2全线基础学习请点击[直达] 4.3及更高版本的补充学习请关注我的博客. ArcGIS API for JavaScr ...

随机推荐

  1. [转帖]关于Xilinx下Micro_Blaze中UartLite232外设的使用

    来源:https://blog.csdn.net/shen_you/article/details/78713746

  2. 设置IE浏览器文档模式版本

    浏览器版本问题是所有开发web的程序员共同的诟病,尤其是IE浏览器,笔者上次修改公司的一个项目中出现项目是在IE9没有出来之前,而现在修改时,则发现页面上出现的表格的错乱(因为表格是通过js动态生成的 ...

  3. 4月17日 （PS：由于时间问题，现在才发，望老师见谅）疯狂猜成语-----第三次站立会议 参会人员：杨霏，袁雪，胡潇丹，郭林林，尹亚男，赵静娜

    疯狂猜成语-----第三次站立会议 参会人员:杨霏,袁雪,胡潇丹,郭林林,尹亚男,赵静娜 会议内容: 组员依次汇报自己的工作进度,并且提出自己在进行任务的过程中遇到的问题,是否解决以及解决办法. 以下 ...

  4. 优动漫PAINT-绘制透明布料教程

    原是一篇日语教程,觉得挺不错的,就劳烦会日语的朋友帮忙翻译了,特此分享!希望可以帮助到大家在绘画上的学习!原教程转载优动漫官网. 作者:JaneMere 相关资讯还可以关注www.dongmansof ...

  5. 优动漫PAINT简简单单绘画绣球花

    本文分享使用优动漫PAINT简简单单绘画绣球花教程: 相关资讯还可以关注http://www.dongmansoft.com 最后告诉你绣球花的花语,还是很和谐美好的呢! 绣球花没有茉莉花的芳香四溢, ...

  6. 洛谷2055 [ZJOI2009]假期的宿舍

    题目描述 学校放假了 · · · · · · 有些同学回家了,而有些同学则有以前的好朋友来探访,那么住宿就是一个问题.比如 A 和 B 都是学校的学生,A 要回家,而 C 来看B,C 与 A 不认识. ...

  7. luogu P2117 小Z的矩阵（结论题）

    题意 题解 这题有点水. 我们发现对答案有贡献的实际上只有左上到右下的对角线上的数. 因为不在这条对角线上的乘积都要计算两遍,然后%2就都没了... 然后就做完了. #include<iostr ...

  8. shell学习日志

    0.shell的变量同环境变量不同,存在用户环境区. 变量赋值的方式是: variable_name = variable_value a= "hello" $a对a进行取值 关于 ...

  9. POJ——T 3020 Antenna Placement

    http://poj.org/problem?id=3020 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 9844   A ...

  10. When you are old （当你老了）

    - William Butler Yeats --威廉·巴特勒·叶芝 When you are old and grey and full of sleep: 当你老了,头发花白,睡意沉沉. And ...