Skip to content

Instantly share code, notes, and snippets.

@zzge163

zzge163/jsbin.iFakeLa.html

Created March 27, 2014 03:37
Show Gist options
  • Save zzge163/9799625 to your computer and use it in GitHub Desktop.
Save zzge163/9799625 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
jsbin.iFakeLa.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<title>Basemap Toggle</title>
<link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.7/js/esri/css/esri.css">
<style>
html, body, #map {
padding:0;
margin:0;
height:100%;
}
#BasemapToggle {
position: absolute;
top: 20px;
right: 20px;
z-index: 50;
}
</style>
<script src="//js.arcgis.com/3.7/"></script>
<script>
var map, toggle;
require([
"esri/map",
"esri/dijit/BasemapToggle",
"esri/config",
"dojo/domReady!"
], function(
Map, BasemapToggle, esriConfig
) {
console.log(esriConfig.defaults.map.basemaps);
esriConfig.defaults.map.basemaps.delorme = {
baseMapLayers: [
{ url: "http://services.arcgisonline.com/ArcGIS/rest/services/Specialty/DeLorme_World_Base_Map/MapServer" }
],
title: "Delorme"
};
map = new Map("map", {
center: [-70.651, 43.145],
zoom: 5,
basemap: "delorme"
});
toggle = new BasemapToggle({
map: map,
basemap: "delorme",
basemaps: {
delorme: {
label: "delorme",
url: "http://www.delorme.com/images/homepage/dbm_icon.jpg"
}, topo: {
label: "topo",
url: "http://js.arcgis.com/3.7/js/esri/dijit/images/basemaps/topo.jpg"
}
}
}, "BasemapToggle");
toggle.startup();
console.log("toggle", toggle);
});
</script>
</head>
<body>
<div id="map" class="map">
<div id="BasemapToggle"></div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment