使用ArcGISAPI for JS4.7加载ArcGIS Server发布的REST和WMS地图服务，ArcGIS Server为本机安装，需要提前完成跨域设置。
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>ArcGIS demo</title>
<link type="text/css" rel="stylesheet" href="http://localhost/arcgis/esri/css/main.css"/>
<script src="http://localhost/arcgis/init.js"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div id="viewDiv"></div>
<script>
require(["esri/Map",
"esri/config",
"esri/views/MapView",
"esri/layers/MapImageLayer",
"esri/geometry/Extent",
"esri/layers/WMSLayer",
"dojo/domReady"
], function (Map,
esriConfig,
MapView,
MapImageLayer,
Extent,
WMSLayer) {
esriConfig.request.corsEnabledServers.push("localhost:6443");//设置地图服务器已允许跨域
var map = new Map({
basemap: "streets"//ESRI提供的底图
});
var view = new MapView({
map: map,
container: "viewDiv",
});
view.ui.remove("attribution");//移除底部ESRI logo
//添加ArcGIS动态切片
// var layer = new MapImageLayer({
// url: "https://localhost:6443/arcgis/rest/services/zhengzhou/MapServer"
// });
// map.add(layer);
//加载WMS地图服务
var layer = new WMSLayer({
url: "https://localhost:6443/arcgis/services/zhengzhou/MapServer/WMSServer",
version: "1.1.1"
});
map.add(layer);
//设置地图显示范围
view.extent = new Extent({
xmin: 113.642578125,
ymin: 34.7222900390625,
xmax: 113.73870849609375,
ymax: 34.78546142578125,
spatialReference: {
wkid: 4326
}
});
})
</script>
</body>
</html>运行效果如下：
