描述

本例展示了如何在地图里指出显示的缓存或切片的细节等级（LODs）。当打开示例地图，可以看到一些来自ArcGIS Online ESRI_Imagery_World_2D图层的影像。这个应用程序配置这个影像仅LOD 0 - 11是可见的，即使在源缓存中存在其他的等级。直接放大最终会切换到来自ArcGIS Online CSP_Imagery_World_2D图层的详细的user-contributed影像。该应用程序配置了user-contributed影像仅仅在LODs 12 -17是可见的。

本例为地图创建了一组LODs，这组LODs合并了在多个缓存服务中的LODs。在ArcGIS JavaScript API 1.2版本以前，仅仅能是使用增加的第一个服务的LODs。 注意设置在ArcGISTiledMapServiceLayer中的displayLevels[]如何转为图层的tileInfo.lods。随后，他们被联接为一个自定义的地图的一组LODs(customLods[])。

放大时可以显示自己的一组数据，而缩小时显示ArcGIS Online或一些其他数据。要执行这个图层转换的类型，匹配的缓存切片方案是必需的。在本例中的两个服务使用ArcGIS Online的缓存切片方案。

 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

 <!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>放大时切换图层</title>

     <script type="text/javascript">djConfig = { isDebug:true };</script>

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

         dojo.require("esri.layers.agstiled");

         var customLods = [];

         var loadCount = 0;

         function init() {

         var esriImageLayer = new esri.layers.ArcGISTiledMapServiceLayer(

             "http://services.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer",

             {displayLevels:[0,1,2,3,4,5,6,7,8,9,10,11]}

         );

         if (esriImageLayer.loaded) {

             addLods(esriImageLayer);

         }else {

             dojo.connect(esriImageLayer,"onLoad",addLods);

         }

         var cspImageryLayer = new esri.layers.ArcGISTiledMapServiceLayer

                 ("http://services.arcgisonline.com/ArcGIS/rest/services/CSP_Imagery_World_2D/MapServer",

                 {displayLevels:[12,13,14,15,16,17]}); //Levels at which this layer will be visible

         if (cspImageryLayer.loaded) {

           addLods(cspImageryLayer);

         } else {

           dojo.connect(cspImageryLayer, "onLoad", addLods);

         }

         }

         //用层次细节填充数组

         function addLods(layer) {

             customLods = customLods.concat(layer.tileInfo.lods);

             loadCount++;

             if(loadCount === 2) {

              initMap();

             }

         }

         //创建地图并且用自定义的层次细节

         function initMap() {

             var map = new esri.Map("map",{

               lods:customLods,

               extent:new esri.geometry.Extent(-82.05,34.87,-80.05,34.99,new esri.SpatialReference({wkid:4326}))

             });

             dojo.connect(map,"onExtentChange",changeScale);

             map.addLayer(esriImageLayer);

             map.addLayer(cspImageryLayer);

         }

         //报告哪一层将被显示

         function changeScale(extent,delta,outLevelChange,outLod) {

             dojo.byId("scale").innerHTML = "LOD Level: <i>" + outLod.level;

             if (outLod.level < 12) {

                 dojo.byId("visibleLayer").innerHTML = "Layer:<i>ESRI_Imagery_World_2D</i>";

             }else{

                 dojo.byId("visibleLayer").innerHTML = "Layer:<i>CSP_Imaery_World_2D</i>";

             }

         }

         dojo.addOnLoad(init);

     </script>

   </head>

   <body >

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

       <span id="scale" style="position: absolute;right: 10px;bottom: 10px;z-index: 100;color: yellow;font-size: 150%;"></span>

       <span id="visibleLayer" style="position: absolute;right: 10px;bottom: 10px;z-index: 100;color: yellow;font-size: 150%;"></span>

       </div>

        <p>Zoom in to the city below to switch to user-contributed imagery from ESRI's content sharing program</p>

   </body>

 </html>

ArcGIS api for javascript——放大时切换图层的更多相关文章

  1. ArcGIS api for javascript——明确的创建图层列表

    描述 本例展示了如何确切地创建一个地图服务里的图层列表.这个列表由HTML checkboxe组成,可用用于开关图层的可见性. 函数updateLayerVisibility()包含开关图层的逻辑.函 ...

  2. ArcGIS API For Javascript：新增热力图层的方法

    当我们要制作一个热力图层,可以通过以下 3 步来实现: 引入类 在 require 中需引入 "esri/layers/FeatureLayer", "esri/rend ...

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

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

  4. 转：ArcGIS API For JavaScript官方文档（二十）之图形和要素图层——①Graphics概述

    原文地址:ArcGIS API For JavaScript官方文档(二十)之图形和要素图层——①Graphics概述 ArcGIS JavaScript API允许在地图上绘制graphic(图形) ...

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

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

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

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

  7. ArcGIS.Server.9.3和ArcGIS API for JavaScript地图实现Toorbar功能（四）

    转自:http://www.cnblogs.com/hll2008/archive/2008/11/22/1338630.html 目的:1.ArcGIS API for JavaScript实现To ...

  8. ArcGIS API for JavaScript 4.2学习笔记[1] 显示地图

    ArcGIS API for JavaScript 4.2直接从官网的Sample中学习,API Reference也是从官网翻译理解过来,鉴于网上截稿前还没有人发布过4.2的学习笔记,我就试试吧. ...

  9. ArcGIS API for JavaScript 4.2学习笔记[0] AJS4.2概述、新特性、未来产品线计划与AJS笔记目录

    放着好好的成熟的AJS 3.19不学,为什么要去碰乳臭未干的AJS 4.2? 4.2全线基础学习请点击[直达] 4.3及更高版本的补充学习请关注我的博客. ArcGIS API for JavaScr ...

随机推荐

  1. Python排序 插入排序

    插入排序从前往后遍历数组的每一个元素,对每一位元素都将其插入到已经有序的部分数组中,所以插入排序的要点就是找出要插入元素在已经有序的部分中的位置,同时,由于插入排序采用原地排序(in-place)算法 ...

  2. 紫书 例题8-6 UVa 1606（扫描法）

    这道题目用扫描法 扫描法:在枚举的过程中维护一些重要的量, 从而简化计算 这道题用到了极角, 叉积, 高一的我表示一脸懵逼 不过自己去百度了一下好像大概看得懂. 这道题我还有一些疑问, 先这样吧 #i ...

  3. 紫书 习题 8-2 UVa 1610 （暴力出奇迹）

    这道题我真的想的非常的复杂, 拿草稿纸一直在找规律,推公式, 然后总有一些特殊的情况. 然后就WA了N次.无奈之下看了别人的博客, 然后就惊了.直接暴力枚举两个相邻字符串 里面的所有可能就可以了--真 ...

  4. HTTP——学习笔记（8）

    HTTP中的一些协议内容会限制某些网站的功能使用 比如,Facebook这类的社交网站,需要实时地观察到海量用户公开发布的内容,而HTTP中的以下标准就会成为瓶颈: 一条连接上只可发送一个请求 请求只 ...

  5. 题解 P3200 【[HNOI2009]有趣的数列】

    说起来这是今天第三道卡特兰数了... 楼上的几篇题解好像都是直接看出这是卡特兰数,所以我就写一下为什么这道题可以用卡特兰数吧. 考察这样相邻的两项:\(a_{2i-1}\)与\(a_{2i}\),根据 ...

  6. 2015 Multi-University Training Contest 2 hdu 5308 I Wanna Become A 24-Point Master

    I Wanna Become A 24-Point Master Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 ...

  7. Python 安装 httplib2

    简述 httplib2 是一个使用 Python 写的支持的非常全面的 HTTP 特性的库.需要 Python2.3 或更高版本的运行环境,0.5.0 版及其以后包含了对 Python3 的支持. 简 ...

  8. 作为一名Android APP开发者的自我总结

    每当接近年尾,最痛苦的工作无疑是写年终总结,写总结的同时不禁感叹这一年过得不容易阿.突然想起这一年也是自己开发Android APP的第一年,于是觉得应该给自己的APP来一个年终总结. 一.开发方面严 ...

  9. Java读取配置文件的方式

    Java读取配置文件的方式-笔记 1       取当前启动文件夹下的配置文件   一般来讲启动java程序的时候.在启动的文件夹下会有配置文件 classLoader.getResource(&qu ...

  10. [javase学习笔记]-8.8 构造代码块

    这一节我们再看一个特殊的代码块.那就是构造代码块. 这里我们简单的通过样例来说明一下: class Person { private String name; { System.out.println ...