在windows的IIS服務(wù)器下配置arcgis api 4.7
1、將下載的arcgis api for javascript4.7開發(fā)包下的library文件夾復(fù)制到C:\inetpub\wwwroot\arcgis_js_api文件夾下,目錄結(jié)構(gòu)如下:

image.png
2、修改C:\inetpub\wwwroot\arcgis_js_api\library\4.7下的init.js文件。打開后搜索 [HOSTNAME_AND_PATH_TO_JSAPI] ,并將其替換成 localhost/arcgis_js_api/library/4.7/,(并把前面的https替換成http),最后的結(jié)果如下所示:

image.png
3、修改C:\inetpub\wwwroot\arcgis_js_api\library\4.7\dojo下的dojo.js文件。步驟同上,最后的結(jié)果如下所示:

image.png
4、解決IIS服務(wù)器的跨域問題。
按照如下路徑找到IIS服務(wù)器:

image.png
打開IIS,找到“HTTP響應(yīng)標(biāo)頭”點進(jìn)去,在右側(cè)可以看到添加,然后添加如下標(biāo)頭即可
Access-Control-Allow-Headers:Content-Type, api_key, Authorization
Access-Control-Allow-Origin:*

image.png

image.png

image.png
5、在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>Test Map</title>
<link rel="stylesheet" href="http://localhost/arcgis_js_api/library/4.7/dijit/themes/claro/claro.css" />
<link rel="stylesheet" href="http://localhost/arcgis_js_api/library/4.7/esri/css/main.css" />
<style>
html, body, #ui-map-view {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
<script src="http://localhost/arcgis_js_api/library/4.7/dojo/dojo.js"></script>
<script>
var myMap, view;
require([
"esri/Basemap",
"esri/layers/TileLayer",
"esri/Map",
"esri/views/MapView",
"dojo/domReady!"
], function (Basemap, TileLayer, Map, MapView){
var customBasemap = new Basemap({
title: "Custom Basemap",
id: "myBasemap"
});
myMap = new Map({
basemap: "osm"
});
view = new MapView({
center: [-111.87, 40.57], // long, lat
container: "ui-map-view",
map: myMap,
zoom: 6
});
});
</script>
</head>
<body class="claro">
<div id="ui-map-view"></div>
</body>
</html>
在windows的tomcat服務(wù)器下配置arcgis api 4.7
1、將下載的arcgis api for javascript4.7開發(fā)包下的library文件夾復(fù)制到 D:\Tomcat5\Tomcat 5.5\webapps\arcgis_js_api (tomcat路徑換成自tomcat的路徑)文件夾下,目錄結(jié)構(gòu)如下:

image.png
2、修改D:\Tomcat5\Tomcat 5.5\webapps\arcgis_js_api\library\4.7下的init.js文件。打開后搜索[HOSTNAME_AND_PATH_TO_JSAPI] ,并將其替換成 localhost/arcgis_js_api/library/4.7/,(并把前面的https替換成http),最后的結(jié)果如下所示:

image.png
3、修改D:\Tomcat5\Tomcat 5.5\webapps\arcgis_js_api\library\4.7\dojo下的dojo.js文件。步驟同上,最后的結(jié)果如下所示:

image.png
4、啟動tomcat
5、在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>Test Map</title>
<link rel="stylesheet" href="http://localhost:8081/arcgis_js_api/library/4.7/dijit/themes/claro/claro.css" />
<link rel="stylesheet" href="http://localhost:8081/arcgis_js_api/library/4.7/esri/css/main.css" />
<style>
html, body, #ui-map-view {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
<script src="http://localhost:8081/arcgis_js_api/library/4.7/dojo/dojo.js"></script>
<script>
var myMap, view;
require([
"esri/Basemap",
"esri/layers/TileLayer",
"esri/Map",
"esri/views/MapView",
"dojo/domReady!"
], function (Basemap, TileLayer, Map, MapView){
var customBasemap = new Basemap({
title: "Custom Basemap",
id: "myBasemap"
});
myMap = new Map({
basemap: "osm"
});
view = new MapView({
center: [-111.87, 40.57], // long, lat
container: "ui-map-view",
map: myMap,
zoom: 6
});
});
</script>
</head>
<body class="claro">
<div id="ui-map-view"></div>
</body>
</html>