在辦公室我聽著歌靜悄悄的寫著代碼,當(dāng)我還沉浸音樂(lè)中物臂。
“小肖啊旺拉,后面有個(gè)項(xiàng)目有用到arcgis技術(shù),你負(fù)責(zé)arcgis技術(shù)研究棵磷,后面的項(xiàng)目也由你來(lái)開發(fā)”蛾狗,老板突然走過(guò)來(lái)慢悠悠的說(shuō)道。
我當(dāng)時(shí)的心情是這樣的:
“arcgis是什么鬼仪媒。沉桌。。算吩。留凭。≠顺玻”
我忐忑的趕緊用度娘搜了一下arcgis蔼夜,終于進(jìn)了arcgis官網(wǎng)https://developers.arcgis.com/javascript/ ,可等半天頁(yè)面才加載出來(lái)压昼。
參照官網(wǎng)的例子寫了一個(gè)加載地圖的Demo求冷,可我等了半天地圖才加載出來(lái)瘤运,“我都不知道這個(gè)過(guò)程發(fā)生了什么?怎么會(huì)這么慢匠题?”
后來(lái)我用谷歌瀏覽器的Network查看了一下拯坟,才發(fā)現(xiàn)是頁(yè)面引用的兩個(gè)文件:
<link rel="stylesheet" >
<script src="https://js.arcgis.com/3.23/"></script>
這倆貨加載耗時(shí)太長(zhǎng)了,“我突然就好像明白了什么韭山。郁季。。钱磅。梦裂。⌒螅”
“這玩意在墻外面呀塞琼。。禁舷。彪杉。。牵咙∨山”
于是我決定我要搭建本地的arcgis Api,光說(shuō)不練假把式洁桌,擼起袖子就開干渴丸。
第一步:下載arcgis_js_v320_api.zip與arcgis_js_v320_sdk.zip這個(gè)兩個(gè)文件包。
第二步:在tomcat中的webapps目錄下新建文件夾arcgis_js_api另凌。
第三步:將arcgis_js_v320_sdk.zip包中sdk文件夾與arcgis_js_v320_api.zip包中l(wèi)ibrary文件夾復(fù)制到步驟二中新建的arcgis_js_api文件夾中谱轨。
第四步:打開arcgis_js_api\library\3.20\3.20\init.js將“[HOSTNAME_AND_PATH_TO_JSAPI]”查找替換為localhost:8888/arcgis_js_api/library/3.20/3.20/。
第五步:打開arcgis_js_api\library\3.20\3.20\dojo\dojo.js將“[HOSTNAME_AND_PATH_TO_JSAPI]”查找替換為localhost:8888/arcgis_js_api/library/3.20/3.20/吠谢。
注:記得將localhost:8888換成自己的地址
以下是所有的實(shí)現(xiàn)代碼:
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>arcgis</title>
<link rel="stylesheet" href="http://localhost:8888/arcgis_js_api/library/3.20/3.20/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://localhost:8888/arcgis_js_api/library/3.20/3.20/esri/css/esri.css">
<script src="http://localhost:8888/arcgis_js_api/library/3.20/3.20/init.js"></script>
<script type="text/javascript">
require([
"esri/map",
"esri/layers/ArcGISTiledMapServiceLayer",
"dojo/parser",
"dojo/domReady!"
], function(
Map,ArcGISTiledMapServiceLayer,parser
) {
parser.parse();
var map = new Map("map", {
//去掉logo
logo:false,
center: [116.250766,29.159637],
zoom:10
});
var url ="http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer";
var layer = new ArcGISTiledMapServiceLayer(url);
map.addLayer(layer);
map.on("load", function() {
var center = new Point(116.250766, 29.159637, new SpatialReference({wkid:4326}));
//縮放定位
map.centerAndZoom(center, 10);
});
});
</script>
</head>
<body class="claro">
<div id="map" style="width:100%;height: 400px;border: 1px blue solid;">
</div>
</body>
</html>
出現(xiàn)如下圖所示土童,說(shuō)明部署成功:
arcgis Api 3.20版本庫(kù)下載地址:https://pan.baidu.com/s/1ggX7KA3 提取碼:j5vz