正文
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));
}
为了使用这个图层，代码创建一个地图并且增加一个来自ArcGISOnline的切片图层，然后在上面放置新建的WMS图层。
function init() {
var map = new esri.Map("map");
map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("..."));
map.addLayer(new my.CityStatesRiversUSAWMSLayer());
}
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"> <html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>Portland Tile Server</title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dijit/themes/tundra/tundra.css">
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.5"></script>
<script type="text/javascript"> dojo.require("esri.map"); dojo.declare("my.PortlandTiledMapServiceLayer",esri.layers.TiledMapServiceLayer,{
constructor:function(){ this.spatialReference = new esri.SpatialReference({wkid:4326});
this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-123.596895130725, 44.297575737946, -121.553757125519, 46.3683237161949, this.spatialReference)); this.tileInfo = new esri.layers.TileInfo({
"rows" :512,
"cols" :512,
"dpi" :96,
"format":"PNG32",
"compressionQuality":0,
"origin": {
"x" : -180,
"y" :90
},
"spatialReference" : {
"wkid" : 4326
},
"lods" :[ {"level" : 0, "resolution" : 0.351562499999999, "scale" : 147748799.285417},
{"level" : 1, "resolution" : 0.17578125, "scale" : 73874399.6427087},
{"level" : 2, "resolution" : 0.0878906250000001, "scale" : 36937199.8213544},
{"level" : 3, "resolution" : 0.0439453125, "scale" : 18468599.9106772},
{"level" : 4, "resolution" : 0.02197265625, "scale" : 9234299.95533859},
{"level" : 5, "resolution" : 0.010986328125, "scale" : 4617149.97766929},
{"level" : 6, "resolution" : 0.0054931640625, "scale" : 2308574.98883465},
{"level" : 7, "resolution" : 0.00274658203124999, "scale" : 1154287.49441732},
{"level" : 8, "resolution" : 0.001373291015625, "scale" : 577143.747208662},
{"level" : 9, "resolution" : 0.0006866455078125, "scale" : 288571.873604331},
{"level" : 10, "resolution" : 0.000343322753906249, "scale" : 144285.936802165},
{"level" : 11, "resolution" : 0.000171661376953125, "scale" : 72142.9684010827},
{"level" : 12, "resolution" : 8.58306884765626E-05, "scale" : 36071.4842005414},
{"level" : 13, "resolution" : 4.29153442382813E-05, "scale" : 18035.7421002707},
{"level" : 14, "resolution" : 2.14576721191406E-05, "scale" : 9017.87105013534},
{"level" : 15, "resolution" : 1.07288360595703E-05, "scale" : 4508.93552506767} ]
}); this.loaded = true;
this.onLoad(this); }, getTileUrl: function(level, row, col) {
return "http://sampleserver1.arcgisonline.com/arcgiscache/Portland_Portland_ESRI_LandBase_AGO/Portland/_alllayers/" +
"L" + dojo.string.pad(level, 2, '0') + "/" +
"R" + dojo.string.pad(row.toString(16), 8, '0') + "/" +
"C" + dojo.string.pad(col.toString(16), 8, '0') + "." +
"png";
}
});
function init() {
var map = new esri.Map("map"); map.addLayer(new my.PortlandTiledMapServiceLayer());
}
dojo.addOnLoad(init); </script>
</head>
<body class="tundra">
<div id="map" style=" width:1024px; height:512px; border:1px solid #000;"></div>
</body>
</html>
