ArcGIS For JavaScript API Resizable Map(크기 조절 가능 한 지도)--(10)

설명:
이 예제 에 서 는 dojox.layout.ResizeHandle 작은 도 구 를 사용 하여 크기 를 조정 할 수 있 는 지 도 를 보 여 줍 니 다.이 견본 의 오른쪽 아래 지 도 를 실행 할 때 그림 의 크기 를 조정 하 는 것 이 포함 되 어 있 습 니 다.지도의 크기 를 조정 하려 면 마 우 스 를 누 르 고 드래그 하 십시오.

온라인 데모:http://help.arcgis.com/en/webapi/javascript/arcgis/samples/map_resize/index.html
참조 연결;http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm?OpenStreetMapLayer

코드 는 다음 과 같 습 니 다:

    <!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,IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
    <title>Resizable Map</title>
    <!--   "Claro"       -->
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/claro/claro.css">
    <!--   CSS     ResizeHandle   -->
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dojox/layout/resources/ResizeHandle.css">
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />
    
    <style type="text/css">
      <!--Adjust the position of map resize handle a little bit -->
     .dojoxResizeHandle {
        right: 0px;
        bottom: 0px;
      }
    </style>
    <script>
      var dojoConfig = {
        //    HTML   ，     dojo widgets(aka.dijits)         
        parseOnLoad: true	//   
      };
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2">
    </script>
    <script type="text/javascript">
    dojo.require("dojo.parser"); 	//         。

    //          
    dojo.require("dojox.layout.ResizeHandle");
    dojo.addOnLoad(pageReady);	//      
	
    var map; 

    function pageReady() {
        var initialExtent = new esri.geometry.Extent(
			17198,
			6008256,
			506394,
			6497452,
			new esri.SpatialReference({
				wkid: 102100
				})
		); 
        map = new esri.Map("mapDiv", { 
            extent: initialExtent,	//   
            sliderStyle: "small"	//     
        });
		//     
        var tiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer");
        map.addLayer(tiledMapServiceLayer); 
    }
    </script>
    </head>

    <body class="claro">
    <!-- Map    -->
    <div id="mapDiv" style="position: relative; width: 400px; height: 400px; border:2px solid #575757;">
      <!-- ResizeHandle widget:     mapDiv   "position: relative"       -               mapDiv -->
      <div data-dojo-type="dojox.layout.ResizeHandle" data-dojo-props="targetId:'mapDiv',activeResize:true,intermediateChanges:true">
        <script type="dojo/method" event="onResize">
          if (window.map) {
            window.map.resize();
          }
        </script>
      </div>
    </div>
    </body>
    </html>

효 과 는 다음 과 같 습 니 다:

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

ArcGIS RouteLayer를 사용한 Web Speech API

ArcGIS API for JavaScript는 최근에 정류장 및 장벽과 같은 경로에 대한 정보와 함께 턴 바이 턴 방향의 결과를 시각화하는 데 사용할 수 있는 을 추가했습니다. ArcGIS Online에 개별 항목...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

ArcGIS For JavaScript API Resizable Map(크기 조절 가능 한 지도)--(10)

좋은 웹페이지 즐겨찾기