zoukankan      html  css  js  c++  java
  • ArcGIS api for javascript——图层-创建WMS图层类型的图层

    本例使用一个WMS端点创建了一个简单的动态图层。首先,代码声明一个新的类my.CityStatesRiversUSAWMSLayer,该类继承esri.layers.DynamicMapServiceLayer

    dojo.declare("my.CityStatesRiversUSAWMSLayer", DynamicMapServiceLayer, {
      ...
    });

    接下来定义了类的构造函数。图层的初始化和完整的范围和空间参考都被定义在构造函数中。代码也设置了图层的loaded属性为true并调用onLoad函数。

    constructor: function() {
      this.initialExtent = this.fullExtent = new esri.geometry.Extent(...);
      this.spatialReference = new esri.SpatialReference(...);
    
    
      this.loaded = true;
      this.onLoad(this);
    },

    最后,getImageUrl方法被执行。getImageUrl方法返回被加到地图的图片的URL。URL使用带范围,宽和高的参数的函数生成。callback函数被调用别且URL作为单一参数被传回。

    getImageUrl: function(extent, width, height, callback) {
      ...
    
    
      callback("..." + dojo.objectToQuery(params));
    }

    为了使用这个图层,代码创建一个地图并且增加一个来自ArcGIS Online的切片图层,然后在上面放置新建的WMS图层。

    function init() {
      var map = new esri.Map("map");
      map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("..."));
      map.addLayer(new my.CityStatesRiversUSAWMSLayer());
    }


     1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
     2    "http://www.w3.org/TR/html4/strict.dtd">
     3 
     4 <html lang="en">
     5   <head>
     6     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     7     <meta http-equiv="X-UA-Compatible" content="IE=7" />
     8     <title>Portland Tile Server</title>
     9 
    10     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dijit/themes/tundra/tundra.css">
    11     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.5"></script>
    12     <script type="text/javascript"> 
    13    
    14         dojo.require("esri.map");
    15         
    16         dojo.declare("my.PortlandTiledMapServiceLayer",esri.layers.TiledMapServiceLayer,{
    17              constructor:function(){
    18             
    19                 this.spatialReference = new esri.SpatialReference({wkid:4326});
    20                 this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-123.596895130725, 44.297575737946, -121.553757125519, 46.3683237161949, this.spatialReference));
    21                 
    22                 this.tileInfo = new esri.layers.TileInfo({
    23                     "rows" :512,
    24                     "cols" :512,
    25                     "dpi"  :96,
    26                     "format":"PNG32",
    27                     "compressionQuality":0,
    28                     "origin": {
    29                         "x" : -180,
    30                         "y" :90                    
    31                     },
    32                     "spatialReference" : {
    33                         "wkid" : 4326
    34                     },
    35                     "lods" :[
    36                     
    37                          {"level" : 0, "resolution" : 0.351562499999999, "scale" : 147748799.285417},
    38                           {"level" : 1, "resolution" : 0.17578125, "scale" : 73874399.6427087},
    39                           {"level" : 2, "resolution" : 0.0878906250000001, "scale" : 36937199.8213544},
    40                           {"level" : 3, "resolution" : 0.0439453125, "scale" : 18468599.9106772},
    41                           {"level" : 4, "resolution" : 0.02197265625, "scale" : 9234299.95533859},
    42                           {"level" : 5, "resolution" : 0.010986328125, "scale" : 4617149.97766929},
    43                            {"level" : 6, "resolution" : 0.0054931640625, "scale" : 2308574.98883465},
    44                           {"level" : 7, "resolution" : 0.00274658203124999, "scale" : 1154287.49441732},
    45                           {"level" : 8, "resolution" : 0.001373291015625, "scale" : 577143.747208662},
    46                            {"level" : 9, "resolution" : 0.0006866455078125, "scale" : 288571.873604331},
    47                            {"level" : 10, "resolution" : 0.000343322753906249, "scale" : 144285.936802165},
    48                            {"level" : 11, "resolution" : 0.000171661376953125, "scale" : 72142.9684010827},
    49                            {"level" : 12, "resolution" : 8.58306884765626E-05, "scale" : 36071.4842005414},
    50                            {"level" : 13, "resolution" : 4.29153442382813E-05, "scale" : 18035.7421002707},
    51                            {"level" : 14, "resolution" : 2.14576721191406E-05, "scale" : 9017.87105013534},
    52                           {"level" : 15, "resolution" : 1.07288360595703E-05, "scale" : 4508.93552506767}
    53                     
    54                     ]
    55                 });
    56                 
    57                 this.loaded = true;
    58                 this.onLoad(this);           
    59             
    60             }, 
    61             
    62        
    63           getTileUrl: function(level, row, col) {
    64           return "http://sampleserver1.arcgisonline.com/arcgiscache/Portland_Portland_ESRI_LandBase_AGO/Portland/_alllayers/" +
    65                   "L" + dojo.string.pad(level, 2, '0') + "/" +
    66                   "R" + dojo.string.pad(row.toString(16), 8, '0') + "/" +
    67                   "C" + dojo.string.pad(col.toString(16), 8, '0') + "." +
    68                   "png";
    69         } 
    70       });
    71         function init() {
    72             var map = new esri.Map("map");
    73         
    74             map.addLayer(new my.PortlandTiledMapServiceLayer());
    75         }
    76         dojo.addOnLoad(init);      
    77         
    78     </script>
    79   </head>
    80    <body class="tundra">
    81     <div id="map"   style=" 1024px; height:512px; border:1px solid #000;"></div>
    82   </body>
    83 </html>
    84  
    85 
    86   
    87   
  • 相关阅读:
    AtCoder Grand Contest 015 题解
    AtCoder Grand Contest 014 题解
    AtCoder Grand Contest 013 题解
    AtCoder Grand Contest 012 题解
    AtCoder Grand Contest 011 题解
    AtCoder Grand Contest 010 题解
    AtCoder Grand Contest 009 题解
    NOIP2017 Day2 题解
    博客园主题备份
    多项式全家桶
  • 原文地址:https://www.cnblogs.com/xiaotian-222/p/6542011.html
Copyright © 2011-2022 走看看