zoukankan      html  css  js  c++  java
  • ArcGIS api for javascript——用第二个服务的范围设置地图范围

    描述

    本例展示了如何设置地图的范围为地图其中一个图层的范围。本例有两个图层:ArcGIS Online上的世界地图图层 ArcGISTiledMapServiceLayer和堪萨斯州的要素的图层ArcGISDynamicMapServiceLayer。本例展示了如何设置地图总是以堪萨斯州范围开始。

    代码包含两个事件监听器,一个是为了每个图层。这些监听器帮助记录多少图层被加载。当图层计数是2,createMapAddLayers函数被调用。这个函数创建一个地图,设置地图范围是myService2(堪萨斯州服务)的范围:

    myMap = new esri.Map("mapDiv", { extent:myService2.fullExtent });

    地图被创建以后,图层被增加。注意加载图层和增加图层不是一回事。在本例中,地图被创建前图层加载,地图创建以后图层被加到地图里。

    直到所有图层被加载前要避免访问地图属性。如果代码中没有包含事件监听器,有可能在myService2完全加载前地图就会尝试去设置它的范围,这回引起意想不到的结果。

     1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
     2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
     3 <html>
     4   <head>
     5     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
     6     <meta http-equiv="X-UA-Compatible" content="IE=7" />
     7     
     8     <title>Set Map Extent Using Second Service</title>
     9     
    10     <link rel="stylesheet" type="text/css" href="styles.css"
    11           href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css">
    12     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>
    13     <script type="text/javascript">
    14         dojo.require("esri.map");
    15         var map,myservice1,myservice2;
    16         
    17         function init(){
    18             map=new esri.Map("map");
    19              myService1=new esri.layers.ArcGISTiledMapServiceLayer(
    20             "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"
    21           // "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer"
    22             );
    23              
    24             var secondaryMapServiceURL = "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer";
    25             //var secondaryMapServiceURL = "http://118.144.36.6:6080/arcgis/rest/services/chakan/henan530/MapServer";
    26             myService2 = new esri.layers.ArcGISDynamicMapServiceLayer(secondaryMapServiceURL,{opacity:0.65});
    27             
    28             var layerLoadCount=0;
    29             //当两个图层加载时运行creatMapAddLayers
    30             
    31             if(myService1.loded){
    32                 layerLoadCount+=1;
    33                 if(layerLoadCount == 2){
    34                     creatMapAddLayers(myService1,myService2);
    35                 }
    36             }else{
    37                 dojo.connect(myservice1,"onLoad",function(service){
    38                     layerLoadCount += 1;
    39                     if(layerLoadCount == 2){
    40                         creatMapAddLayers(myService1,myService2);
    41                     }            
    42                 });
    43             }
    44             if(myService2.loded){
    45                 layerLoadCount+=1;
    46                 if(layerLoadCount == 2){
    47                     creatMapAddLayers(myService1,myService2);
    48                 }
    49             
    50             }else{
    51                 dojo.connect(myservice2,"onLoad",function(service){
    52                     layerLoadCount += 1;
    53                     if(layerLoadCount == 2){
    54                         creatMapAddLayers(myService1,myService2);
    55                     }
    56             
    57             });            
    58         }
    59         //创建一个地图,设置范围并添加到地图服务中
    60         function creatMapAddLayers(myService1,myService2){
    61         //创建地图
    62             map=new esri.Map("mapDiv",{extent:myservice2.fullExtent});
    63             map.addLayer(myService1);
    64             map.addLayer(myService2);
    65             dojo.connect(map,"onClick",addPoint);
    66             function addPoint(event){
    67                 map.infoWindow.setTitle("Coordinates-坐标");
    68                 map.infoWindow.setContent("经/纬:" + event.mapPoint.x + "," + event.mapPoint.y
    69                 +"<br/>screen x/y: " + event.screenPoint.x + ","+event.screenPoint.y);
    70                 
    71                 map.infoWindow.show(event.screenPoint,map.getInfoWindowAnchor(event.screenPoint));
    72             }
    73         
    74         }
    75         
    76         
    77         }
    78         dojo.addOnLoad(init);
    79         
    80     </script>
    81   </head>
    82   
    83   <body class="tundra">
    84     <div id="map" style="600px;height:400px;border:1px solid #000"></div>
    85     <br>
    86     This map shows two services:
    87     <ul>
    88     <li>An ArcGIS Online tiled service that has a world extent.</li>
    89     <li>A second dynamic service with an extent of the State of Kansas.  This is the extent used when the maps are first displayed. </li>
    90     </ul>
    91 
    92     Note that if you want to combine to tiled services in the same map, they must have the same tile configuration.
    93   </body>
    94 </html>
  • 相关阅读:
    存储过程
    C++学习总结
    Android快速开发系列 10个常用工具类
    SimpleHttpServer的学习之总体架构
    SimpleHttpServer的学习之UML
    SimpleHttpServer的学习(1)
    map用法
    idea 中resources下于java包名相同的包不能导入XML文件问题
    leetcode621
    Yukari's Birthday 枚举+二分 过程注意数据的溢出问题 HDU4430
  • 原文地址:https://www.cnblogs.com/xiaotian-222/p/6514902.html
Copyright © 2011-2022 走看看