ArcGIS API for JavaScript结合2个GIS服务

  此示例创建一个地图,并增加了两层的ArcGIS Online。 ArcGIS Online的是切片地图,由ESRI提供的服务,您可以使用您的应用程序,加强与高品质的地图和数据集。此示例将创建一个基本的地图图像和运输层。
  由于ArcGIS Online的层高速缓存,它们是由ArcGISTiledMapServiceLayer。层序是由map.addLayer方法是调用的顺序。添加第一层是放置在底部。后续图层放在上面。在此示例中,运输层放在图像层的顶部。
  最上一层是由略透明使用setOpacity方法:dynamicMapServiceLayer.setOpacity(0.85);
 <!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>ArcGIS Online tiled maps.</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");       function init() {         var map = new esri.Map("mapDiv");         var imageryPrime = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D /MapServer");         map.addLayer(imageryPrime);         var transportationReference = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/ESRI_BoundariesPlaces _World_2D/MapServer",{"opacity":0.85});         map.addLayer(transportationReference);       }       dojo.addOnLoad(init);     </script>

 </head>   <body class="tundra">

<div id="mapDiv" style="width:800px; height:600px; border:1px solid #000;"></div> 

<div>Creates a map and adds two ArcGIS Online map service layers via ArcGISTiledMapServiceLayer.<br />

 <ul>       <li>Drag to pan</li>       <li>SHIFT + Click to recenter</li>       <li>SHIFT + Drag to zoom in</li>       <li>SHIFT + CTRL + Drag to zoom out</li>       <li>Mouse Scroll Forward to zoom in</li>       <li>Mouse Scroll Backward to zoom out</li>       <li>Use Arrow keys to pan</li>       <li>+ key to zoom in a level</li>       <li>- key to zoom out a level</li>       <li>Double Click to Center and Zoom in</li>     </ul>     </div>   </body> </html>

 

posted @ 2022-08-04 14:04  devgis  阅读(135)  评论(0编辑  收藏  举报