-
Basemap 類
基礎底圖類，API提供了17種底圖
我們也可以自定義底圖,代碼如下。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<title>Custom Basemap - 4.12</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link
href="https://js.arcgis.com/4.12/esri/themes/light/main.css"
rel="stylesheet"
type="text/css"
/>
<script src="https://js.arcgis.com/4.12/"></script>
<script>
require([
"esri/layers/WebTileLayer",
"esri/Map",
"esri/Basemap",
"esri/widgets/BasemapToggle",
"esri/views/SceneView"
], function(WebTileLayer, Map, Basemap, BasemapToggle, SceneView) {
// Create a WebTileLayer with a third-party cached service
var mapBaseLayer = new WebTileLayer({
urlTemplate:
"https://stamen-tiles-{subDomain}.a.ssl.fastly.net/terrain/{level}/{col}/{row}.png",
subDomains: ["a", "b", "c", "d"],
copyright:
'Map tiles by <a href="http://stamen.com/" target="_blank" rel="external nofollow" >Stamen Design</a>, ' +
'under <a href="http://creativecommons.org/licenses/by/3.0" target="_blank" rel="external nofollow" >CC BY 3.0</a>. ' +
'Data by <a href="http://openstreetmap.org/" target="_blank" rel="external nofollow" >OpenStreetMap</a>, ' +
'under <a href="http://creativecommons.org/licenses/by-sa/3.0" target="_blank" rel="external nofollow" >CC BY SA</a>.'
});
// Create a Basemap with the WebTileLayer. The thumbnailUrl will be used for
// the image in the BasemapToggle widget.
var stamen = new Basemap({
baseLayers: [mapBaseLayer],
title: "Terrain",
id: "terrain",
thumbnailUrl:
"https://stamen-tiles.a.ssl.fastly.net/terrain/10/177/409.png"
});
var map = new Map({
basemap: "satellite",
ground: "world-elevation"
});
var initCamera = {
heading: 124.7,
tilt: 82.9,
position: {
latitude: 40.713906,
longitude: -111.848111,
z: 1990
}
};
var view = new SceneView({
container: "viewDiv",
map: map,
camera: initCamera
});
view.when(function() {
// Add a basemap toggle widget to toggle between basemaps
var toggle = new BasemapToggle({
titleVisible: true,
view: view,
nextBasemap: stamen
});
// Add widget to the top right corner of the view
view.ui.add(toggle, "top-right");
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
聯系方式
https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=basemap-custom
![ArcGIS api for javascript通過IdentityManager注冊token的方式通路enterprise的安全服務[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)