ArcGIS api for javascript——動態創建圖層列表


描述

本例循環地圖服務里的所有圖層並增加每個圖層到一個帶checkbox的列表,checkbox能設置圖層的顯示或隱藏。動態創建列表的優勢是所有的圖層都會包含在列表中,即使服務器管理員刪除或增加了圖層。如果不想包含所有圖層,僅僅要一個子集,見示例 Explicitly create layer list

注意本例在建立圖層列表以前檢查圖層是否被完全加載。

函數buildLayerList()循環訪問每個圖層並作為一個HTML checkbox加入列表。該函數建立了一個圖層列表。默認每個圖層的可見行被保存在列表中。

每當某人選擇或不選checkbox,函數updateLayerVisibility()被調用。 函數循環訪問列表中的每個圖層,記錄哪些圖層是可見的數組,然后調用 ArcGISDynamicMapServiceLayer.setVisibleLayers()方法。地圖服務里的地圖數組可以通過這個方法被設置。

 

 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 3 <html>
 4   <head>
 5     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 6     <meta http-equiv="X-UA-Compatible" content="IE=7" />
 7     <title>動態創建圖層列表</title>
 8     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css">
 9     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>
10     <script type="text/javascript">
11         dojo.require("esri.map");
12         
13         var dynamicMapServiceLayer,map,visible = [];
14         
15         function init() {
16             map = new esri.Map("map");
17             
18             dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(
19                 "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer"
20             );
21             
22             if (dynamicMapServiceLayer.loaded) {        
23                 buildLayerList(dynamicMapServiceLayer);              
24             }else{
25                 dojo.connect(dynamicMapServiceLayer,"onLoad",buildLayerList);
26             }       
27         }
28         
29         function buildLayerList(layer) {
30             var infos = layer.layerInfos, info;
31             var items = [];
32             for (var i=0,j=infos.length;i<j;i++) {
33                 info = infos[i];
34                 if (info.defaultVisibility) {
35                     visible.push(info.id);
36                 }
37                 items[i] = "<input type='checkbox' class='list_item' checked='" + (info.defaultVisibility ? "checked" : "") + "' id='" + info.id +"' onclick='updateLayerVisibility();'/><label for='" +info.id+ "'>" +info.name+ "</label>";          
38             }
39             dojo.byId("layer_list").innerHTML = items.join();
40             
41             layer.setVisibleLayers(visible);
42             map.addLayer(layer);
43         
44         }
45         
46         function updateLayerVisibility() {
47             var inputs = dojo.query(".list_item"), input;
48             visible = [];
49             for (var i=0,j=inputs.length;i<j;i++) {
50                 if(inputs[i].checked) {
51                     visible.push(inputs[i].id);
52                 }           
53             }
54             dynamicMapServiceLayer.setVisibleLayers(visible);
55         
56         }
57         dojo.addOnLoad(init);
58     
59     </script>
60 
61   </head>
62 
63   <body >
64       This sample loads an ArcGISDynamicMapServiceLayer.<br />
65     It determines the layers in the map service and presents them as checkboxes that can be used to toggle their visibility.<br />
66     <br />
67       Layer List: <span id="layer_list"></span><br />
68       <br />
69       <div id="map" class="tundra" style="width: 900px;height: 600px;border: 1px solid #000"></div>
70   </body>
71 </html>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM