ArcGIS For JavaScript API Show map properties —— 显示地图信息

描述:此示例显示了如何读取地图和图层属性和报告的信息返回给用户

在线演示:http://help.arcgis.com/en/webapi/javascript/arcgis/samples/map_showproperties/index.html

引用联接:http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm

代码分析如下:

<!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,IE=9" />  
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices-->  
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>  
    <title>ArcGIS JavaScript API Map Layer</title>  
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/claro/claro.css">  
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />  
    <style>   
      html, body { height: 98%; width: 98%; margin: 0; padding: 5px; }    
    </style>   
    <script type="text/javascript">var djConfig = {parseOnLoad: true};</script>   
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script>  
    <script type="text/javascript">  
        //导入包  
        dojo.require("esri.map");  
        dojo.require("dijit.layout.BorderContainer");  
        dojo.require("dijit.layout.ContentPane");  
        
        var map, basemap, transportation, census;  
  
      function init() {  
        map = new esri.Map("map");  
  
        basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/TaxParcel/AssessorsBasemap/MapServer");  
        map.addLayer(basemap);  
  
        transportation = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/ESRI_Transportation_World_2D/MapServer", {"id":"agoreference", "opacity":0.5});  
        map.addLayer(transportation);  
  
        census = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer", {"id":"census","opacity":0.5});  
        map.addLayer(census);  
          
        dojo.connect(map, 'onLoad', function(theMap) {           
         // 窗格中显示详细的地图信息  
         // 层细节  
         var content = "";    
         var layerInfo = [];    // 图层数组,用于显示  
         dojo.forEach(map.layerIds,function(id){    // 遍历 TiledMapServiceLayers 和 DynamicMapServiceLayers 添加到地图中的数组  
            var layer = map.getLayer(id);  
            layerInfo.push("id: " + layer.id + " visible(): " + layer.visible + " opacity(透明度): " + layer.opacity + "<br />");  
         });  
          var sr  = "Spatial Reference(空间参考): " +  map.spatialReference.wkid + "<br />";  
          var size = "Width(宽): " + map.width + " Height(高): " + map.height + "<br />";  
  
          // 获得尺度细节  
          var tileInfo = basemap.tileInfo;      //包含ArcGISTiledMapServiceLayer的切片方案信息  
          var scales = [];  
            dojo.forEach(tileInfo.lods,function(lod){  
              var level = lod.level;  
              var scale = lod.scale;  
              resolution = lod.resolution;  
              scales.push( "level(深度): " + level + " scale(刻度): " + scale + " resolution(分辨率): " + resolution + "<br />");  
            });  
          dojo.byId('rightPane').innerHTML = "<b>Layers(层):</b><br />" +  layerInfo.join("") +   
          "<b>Spatial Reference(空间参考):</b> <br /> " + sr +   
          "<b>Map Size(地图尺寸):</b> <br />" + size +   
          "<b>Scales(刻度):</b><br />" + scales.join("");  
  
  
          //当浏览器调整,调整地图的大小  
          dojo.connect(dijit.byId('map'), 'resize', map,map.resize);  
        });  
      }  
  
      dojo.addOnLoad(init); // 初始化加载  
    </script>  
  </head>  
  <body class="claro">  
    <div id="content" dojotype="dijit.layout.BorderContainer" design="headline" gutters="true" style="width: 100%; height: 100%; margin: 0;">   
      <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="overflow:hidden;">   
      </div>   
       <div id="rightPane" style="height:200px;" dojotype="dijit.layout.ContentPane" region="bottom">   
      </div>  
    </div>   
  </body>  
</html>

效果如下:

ArcGIS For JavaScript API Show map properties —— 显示地图信息

未经允许请勿转载:程序喵 » ArcGIS For JavaScript API Show map properties —— 显示地图信息

点  赞 (0) 打  赏
分享到: