ArcGIS Server API for JavaScript 參考 手冊(http://goo.gl/M1gEVI/) 教學(http://goo.gl/9JpeZO) 第一項 教的建置第一個應用程式就稱它為 Hello Map 吧!
照著手冊教學 刻一次吧！
Html:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no"> <title>Hello Map</title> <link rel="stylesheet" href="http://js.arcgis.com/3.12/esri/css/esri.css"> <script src="http://js.arcgis.com/3.12/"></script> </head> <body class="claro"> <div id="mapDiv"></div> </body> </html>說明：
1. 引用 CSS 需插入 <link rel="stylesheet" href="http://js.arcgis.com/3.12/esri/css/esri.css"> 2. 引用 Javascript 需插入 <script src="http://js.arcgis.com/3.12/"></script> 其中已包含了Dojo框架囉 3. <body> 標籤中 加入 class 樣式定義為 "claro" 如： <body class="claro"> 4. 加入 div 區塊 當作地圖區塊 ，如：<div id="mapDiv"></div>
CSS:
html, body, #mapDiv {
padding: 0;
margin: 0;
height: 100%;
}
說明：1. 定義 mapDiv 區塊的 CSS 樣式
JavaScript:
var map;
require(["esri/map", "dojo/domReady!"], function(Map) {
map = new Map("mapDiv", {
center: [121, 23],
zoom: 8,
basemap: "streets"
});
});
說明：1. 定義 弱型別的變數 map
.require 是 Dojo 方法，利用該方法 載入 esri/map、dojo/domReady! ，這兩個是什麼東西呢？
根據 Dojo API參考文件來說，
/ 之前的叫 The main packages of the Dojo Toolkit (這啥米)，
四次元百寶袋中的整人套件組？誤 道場工具箱裡的主要套件嗎？
/ 之後的叫 Common modules and packages of the Dojo Toolkit (這啥米)，
四次元百寶袋中的普及版整人套件組？誤 道場工具箱裡的常用模組嗎？
那就管它叫為「模組」或者「 四次元空間袋中的整人工具組」誤「包裹」，
載入模組後，需用一個 變數來接收該模組，以便於操作
例如 function(Map) {} 用一個 拋棄式的函數 裡面定義一個 Map 變數 ，該變數就被成一個 esri/map 類別
2. function(Map) {} 用一個 拋棄式的函數 裡面定義 map 變數，
透過傳入的 Map 類別可以 宣告成一個 esri/map 的物件
（new Map 宣告方法 就要查 https://developers.arcgis.com/javascript/jsapi/map-amd.html ）
JSBin Demo(http://goo.gl/zi8RST)
沒有留言 :
張貼留言