I have added the USA Topo maps to the BasemapGallery. Works great in the widget as an option to choose from.
But I want to make the USA Topo maps the default for the web application. I cannot seem to get it to recognize the new layer.
For now, I have set the basemap to be "gray".
Then I make the BasemapGallery.
Then, when the user zooms in, it should change to my new basemap. This code works if I change the basemap to "topo" or one of the other ArcGIS basemaps. But it won't get the usatopo basemap.
In this example, I also add the google maps. I'd be interested in knowing how to select one of the google themes as a basemap.
But first things first, - how do I get the usatopo to be the default? If I make it a tiled layer and add it as a map layer ( as in using map.addLayers([usatopo]) , then it covers the other basemaps, if someone switches to one of those. So it's acting like a layer and not a basemap.
Thank you.
==================================================
map = new Map("map", {
center: [-120.6, 44],
zoom: 7,
basemap: "gray",
sliderOrientation: "vertical",
sliderStyle: "small",
fadeOnZoom: true,
force3DTransforms: true,
showAttribution: false,
navigationMode: "css-transforms"
});
map.on("load", function () {
otherMapFeatures();
this.map.on("zoom-end", task);
});
function task() {
this.map.setBasemap("usatopo"); // this work with "topo"
});
function otherMapFeatures(){
...
var mybasemap = [];
var usatopo = new BasemapLayer({
url: "http://services.arcgisonline.com/arcgis/rest/services/USA_Topo_Maps/MapServer"
});
var myUSATopo = new Basemap({
layers: [usatopo],
id: "usatopo",
title: "USA Topo",
thumbnailUrl: "images/usatopo.png"
});
mybasemap.push(myUSATopo);
var basemapGallery = new BasemapGallery({
showArcGISBasemaps: true,
basemaps: mybasemap,
map: map,
google: {
apiOptions: {
v: '3.6' // use a specific version is recommended for production system.
},
mapOptions: {
streetViewControl: false
}
},
}, "basemapGallery");
basemapGallery.startup();
basemapGallery.on("error", function (msg) {
console.log("basemap gallery error: ", msg);
});
==================================================
Solved! Go to Solution.
i'd recommend listening for the startup event of the BasemapGallery and then calling BasemapGallery.select() with the id your USA topo layer.
https://developers.arcgis.com/javascript/jsapi/basemapgallery-amd.html#select
i'd recommend listening for the startup event of the BasemapGallery and then calling BasemapGallery.select() with the id your USA topo layer.
https://developers.arcgis.com/javascript/jsapi/basemapgallery-amd.html#select
OK, finally got it to work.
basemapGallery.select("usatopo") - what I used for the ID when I defined it.
Just a note here: This is not the same for "topo". "topo" is not the ID of the standard topo theme. The ID is more like "basemap_5" and I think the numbers change. I used the following to find out what the actual ID and title are called.
first make the selection in the gallery, then call a function that includes:
var a = basemapGallery.getSelected();
console.log("a " + a.id + " " + a.title);