本文主要介紹如何將ArcGIS API for JavaScript部署到本地的Tomcat中。
安裝Tomcat軟件
甩個鏈接,官網:https://tomcat.apache.org/download-70.cgi
個人建議下載Tomcat 7,不建議下載最新版本。下載完成之后解壓到相應的盤就可以(記住路徑)。
下載ArcGIS API for JavaScript
甩個鏈接:https://developers.arcgis.com/javascript/latest/guide/get-api/index.html#download-api
或者:https://download.csdn.net/download/shengshengshiwo/10291572
修改兩個JS文件
- 在任意位置解壓ArcGIS API for JavaScript 3.23文件。
- 進入
arcgis_js_v323_api\arcgis_js_api\library\3.23
,打開install_api_windows.html
頁面,找到安裝教程,如圖所示:
修改如圖指示文件。
修改文件一(init.js)
位置:arcgis_js_v323_api\arcgis_js_api\library\3.23\3.23
修改內容:將 [HOSTNAME_AND_PATH_TO_JSAPI]
替換成 localhost:8080/arcgis_js_api/library/3.23/3.23
修改文件二(dojo.js)
位置:arcgis_js_v323_api\arcgis_js_api\library\3.23\3.23\dojo\dojo.js
修改內容:將 [HOSTNAME_AND_PATH_TO_JSAPI]
替換成 localhost:8080/arcgis_js_api/library/3.23/3.23
將修改好的文件放入指定的位置
將arcgis_js_api
文件夾移動到Tomcat安裝目錄的webapps
目錄下,如圖所示:
注意:不是
arcgis_js_v323_api
整個文件夾。
測試ArcGIS API for JavaScript函數庫是否安裝成功。
打開服務器
找到Tomcat安裝目錄,我的是:C:\Program Files\Apache Software Foundation\apache-tomcat-7.0.85\bin
找到startup.bat
雙擊打開。
切記,打開后不要關閉此窗口。
在桌面上新建一個index.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>Simple Map</title>
<link rel="stylesheet" href="https://localhost:8080/arcgis_js_api/library/3.23/3.23/esri/css/esri.css">
<script type="text/javascript" src="https://localhost:8080/arcgis_js_api/library/3.23/3.23/init.js"></script>
<style>
html, body, #map {
height: 100%;
margin: 0;
padding: 0;
}
</style>
<script>
var map;
require(["esri/map", "dojo/domReady!"], function(Map) {
map = new Map("map", {
basemap: "topo", //For full list of pre-defined basemaps, navigate to http://arcg.is/1JVo6Wd
center: [-122.45, 37.75], // longitude, latitude
zoom: 13
});
});
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>
發現網頁沒有東西有沒有??
我們再看一下安裝說明
將 https
修改為 http
就可以了。輸入以下代碼:
<!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>Simple Map</title>
<link rel="stylesheet" href="http://localhost:8080/arcgis_js_api/library/3.23/3.23/esri/css/esri.css">
<script type="text/javascript" src="http://localhost:8080/arcgis_js_api/library/3.23/3.23/init.js"></script>
<style>
html, body, #map {
height: 100%;
margin: 0;
padding: 0;
}
</style>
<script>
var map;
require(["esri/map", "dojo/domReady!"], function(Map) {
map = new Map("map", {
basemap: "topo", //For full list of pre-defined basemaps, navigate to http://arcg.is/1JVo6Wd
center: [-122.45, 37.75], // longitude, latitude
zoom: 13
});
});
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>
如果看到一張地圖時,說明安裝就成功了。