ArcGIS api for javascript——加入动态地图

描述

这个示例展示了增加一个按用户缩放或平移服务器每次绘制的地图。这样的地图没有切片的 cache并被调用一个动态地图服务图层。 ArcGISDynamicMapServiceLayer表示ArcGIS JavaScript API动态地图服务。

动态地图服务执行效率比切片地图服务慢。如果不能创建一个切片的缓存,只能使用动态地图服务。如果数据修改比更新缓存要快,可能不能创建一个缓存,或者需要实时数据的显示。

下行代码创建了地图:

var map = new esri.Map("map");

上面行中"Map"出现了三次。第一次(var map)是对象的名称,第二次 (esri.Map)是类的名称,第三次("map")是将包含地图的DIV的名称。

注意动态地图服务图层的构造函数需要服务的REST端点的URL(http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer). 可以使用Services Directory找到地图服务的URL。

注意图层使用setOpacity方法设置半透明的。 然后用地图的addLayer方法增加图层到地图。

dynamicMapServiceLayer.setOpacity(0.5);
map.addLayer(dynamicMapServiceLayer);

<%-- <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> --%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//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>DynamicMapServiceLayer</title>
    <link rel="stylesheet" type="text/css" href="styles.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("map");//创建地图,该层为半透明,要使用它的setOpacity方法
            var imageParameters = new esri.layers.ImageParameters();
            //设置图像类型为JPEG
            imageParameters.format = "JPEG";
            //非缓存地图服务URL
            var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(
                "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer",
                {"opacity":0.5, "imageParameters":imageParameters}
            );
            //将动态地图服务图层添加到地图中
            map.addLayer(dynamicMapServiceLayer);
        }
        dojo.addOnLoad(init);
    </script>
  </head>
  
  <body class="tundra">
    <div id="map" style="width:900px;height:600px;border:1px solid #000"></div>
    Create a map adds an ArcGISDynamicMapServiceLayer.<br>
    Map navigation using mouse:
    <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>
  </body>
</html>

 

posted @ 2017-03-07 14:12  xiaotian_小天  Views(1944)  Comments(0Edit  收藏  举报