描述

这个示例加入一个通过ArcGISTiledMapServiceLayer表示的cachedArcGIS Server地图服务，和一个通过ArcGISDynamicMapServiceLayer表示的非缓存服务到同一个地图。

图层顺序由map.addLayer方法调用的顺序决定。第一个被增加的图层被放置在下方。后来的图层放置在上面。 在这个示例中，动态图层被在切片图层的上面。动态图层放置在切片图层上方是常用的方案，因为基础地图数据通常适合用ArcGIS Server的地图缓存而覆盖图经常需要修改和实时更新，因此不适合用缓存。

注意顶层图使用setOpacity方法设置为半透明:

dynamicMapServiceLayer.setOpacity(0.5);

 <%@ 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>TiledMap And DynamicMap</title>

     <style type="text/css">

         @import

         "http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css";

     </style>

     <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");

             //添加地图的URL,可缓存的切片地图

             var tiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer(

                 "http://server.arcgisonline.com/ArcGIS/rest/services/NGS_Topo_US_2D/MapServer"

             );

             map.addLayer(tiledMapServiceLayer);

             //非缓存地图服务URL-动态地图服务层,放在上面，并设置为半透明

             var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(

                 "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer", {"opacity":0.5}

             );

             map.addLayer(dynamicMapServiceLayer);

         }

         dojo.addOnLoad(init);

     </script>

   </head>

   <body class="tundra">

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

     Creates a map and adds an ArcGISDynamicMapServiceLayer and an ArcGISTiledMapServiceLayer.<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>

ArcGIS api for javascript——合并切片和动态图层的更多相关文章

  1. arcgis api for JavaScript _加载三维图层(scene layer)

    arcgis api for JavaScript _加载三维图层(scene layer) arcgis api for JavaScript  4.x 版本增加对三维的支持. 关于三维图层(sce ...

  2. ArcGIS api for javascript——合并两个ArcGIS Online服务

    描述 这个示例创建一个地图并ArcGIS Online增加连个图层到地图.ArcGIS Online是由ESRI体提供的一组切片地图服务,可以用来通过高质量的地图和数据增强应用.这个示例增加影像和运输 ...

  3. ArcGIS API for JavaScript介绍

    ArcGIS API for JavaScript中的类是按照模块组织的,主要包含esri.esri/geometry.esri/renderers.esri/symbols.esri/symbols ...

  4. ArcGIS API for JavaScript（2）-ArcGIS Server发布要素图层服务

    1.前言 上一篇该系列的文章我们主要讲了一下基础Web地图搭建,这篇我们主要讲一下ArcGIS Server发布服务,并且如何调用服务.将自己的数据加载到Web地图当中来,实现Web端浏览数据. 2. ...

  5. ArcGIS API for JavaScript：Layer之间那点儿事

    先来看一个模型: |–TiledMapServiceLayer  |       |–ArcGISTiledMapServiceLayer  |–DynamicLayer  |       |–Dyn ...

  6. Arcgis api for javascript学习笔记(3.2X版本)-初步尝试

    Arcgis api for javascript(3.22版本)官方地址 :https://developers.arcgis.com/javascript/3/ 1. 根据官方示例实现一个简单地图 ...

  7. 基于ArcGIS API for Javascript的地图编辑工具

    最近工作上需要用ArcGIS API for Javascript来开发一个浏览器上使用的地图编辑工具,分享一下一些相关的开发经验. 我开发的地图编辑工具是根据ESRI提供的例子修改而来的,参考的例子 ...

  8. ArcGIS API for JavaScript 4.0（一）

    原文:ArcGIS API for JavaScript 4.0(一) 最近ArcGIS推出了ArcGIS API for JavaScript 4.0,支持无插件3D显示,而且比较Unity和Sky ...

  9. ArcGIS API for JavaScript开发环境搭建及第一个实例demo

    原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...

随机推荐

  1. SpringBoot学习笔记(13)----使用Spring Session+redis实现一个简单的集群

    session集群的解决方案: 1.扩展指定server 利用Servlet容器提供的插件功能,自定义HttpSession的创建和管理策略,并通过配置的方式替换掉默认的策略.缺点:耦合Tomcat/ ...

  2. SpringBoot学习笔记(3)----SpringBoot的profile多环境配置

    在实际的应用开发中,可能会需要不同配置文件来支撑程序的运行,如开发,测试,预生产,生产环境等,程序在不同的环境下可能需要不同的配置,如不同数据源等,如果每次在不同的环境下都要去修改配置文件就会闲得不合 ...

  3. pace.js 原理（转）

    pace.js监控了什么: pace.js对于加载进度监控了什么呢?通过阅读源码,我们看到整体的进度有四个部分组成:document,elements,eventLag和ajax这四种监视器(Moni ...

  4. web移动端-弹性盒模型

    (父元素加) : /*新版弹性盒模型*/ /* display: flex; */ /*设置主轴方向为水平方向*/ /* flex-direction: row; */ /*设置主轴方向为垂直方向*/ ...

  5. UVA-12083 Guardian of Decency 二分图 最大独立集

    题目链接:https://cn.vjudge.net/problem/UVA-12083 题意 学校组织去郊游,选择最多人数,使得任意两个人之间不能谈恋爱 不恋爱条件是高差大于40.同性.喜欢的音乐风 ...

  6. mariadb-增删改查怎么用

    MariaDB 数据类型 MariaDB数据类型可以分为数字,日期和时间以及字符串值. 使用数据类型的原则:够用就行,尽量使用范围小的,而不用大的 常用的数据类型 整数:int, (bit比整数还要小 ...

  7. WPF Toolkit AutoCompleteBox 实体类绑定 关键字自定义关联搜索匹配

    原文:WPF Toolkit AutoCompleteBox 实体类绑定 关键字自定义关联搜索匹配 WPF Toolkit AutoCompleteBox 实体类绑定 关键字自定义关联搜索匹配 网上的 ...

  8. C++容器（五）：set类型

    set类型 map容器是键-值对的集合,好比以任命为键的地址和电话号码.而set容器只是单纯的键的集合.当只想知道一个值是否存在时,使用set容器是最适合. 使用set容器必须包含set头文件: #i ...

  9. ACM POJ 1146 ID Codes

    题目大意:输入一个字符串.输出它的下一个字典序排列. 字典序算法思想: 1.从右向左寻找字符串找出第一个a[i]<a[i+1]的位置i; 2.从右向左找出第一个大于a[i]的元素a[j]; 3. ...

  10. Block的使用－－初探Block

    看了两天的Block. 网上是有非常多解说与教程,也有讲得非常好的.这里就主要解说下我的理解与收获.欢迎拍砖. 所谓block.我觉得应该是一个闭包函数.而闭包,就是说block以及内部全部的变量生命 ...