ArcGIS For JavaScript API Resizable Map(크기 조절 가능 한 지도)--(10)
3730 단어 arcgisForJavaScriptARCGIS 2 차 개발
이 예제 에 서 는 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 JavaScript를 사용한 비닝 소개최근까지 이를 사용하여 애플리케이션의 기능을 정의 할 수 있었습니다. 데이터 세트 및 사용하려는 규모에 따라 약간의 조정이 필요할 수 있지만 좋은 수준을 찾으면 모든 준비가 된 것입니다. 일반적으로 수행하는 첫 번째...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.