ArcGIS API for JavaScript 调用自定义地图模板总结
3.9版本
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello World</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/tundra/tundra.css" />
<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css" />
<script src="http://js.arcgis.com/3.9/"></script>
<style>
html,body,
#mapDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require(["esri/map","esri/layers/ArcGISDynamicMapServiceLayer","dojo/domReady!"],function(Map,ArcGISDynamicMapServiceLayer){
var map = new Map("mapDiv");
//利用url创建一个动态地图服务对象
var mapUrl = "...";
var layer = new ArcGISDynamicMapServiceLayer(mapUrl);
//将地图服务对象添加到地图容器中
map.addLayer(layer);
})
</script>
</head>
<body class="tundra">
<div id="mapDiv"></div>
</body>
</html>
4.24版本
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
html,body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.24/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.24/"></script>
<script>
require(["esri/Map", "esri/views/MapView", "esri/layers/MapImageLayer"], function (Map, MapView, MapImageLayer) {
const map = new Map();
// points to the states layer in a service storing U.S. census data
let layer = new MapImageLayer({
url: "..." ,
});
map.add(layer); // adds the layer to the map
// 创建一个map视图 后期视图上的操作都通过这个对象来操作
const view = new MapView({
container: "viewDiv",//html容器,即将地图添加到哪个容器里
map: map,
// center: [449674.2785, 3567446.0419],
zoom: 4,
// center: [15, 65] // longitude, latitude 地图初始位置
logo: false //不显示Esri的logo
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
注明:翻译自esri,仅供个人查阅使用,侵删