Looking for some help calling a custom basemap gallery (group) from ArcGIS Online into our custom JavaScript web application. We could add each of the basemaps individually in the code, but seems like there should be a way to grab the whole group (shared to Everyone) and populate the basemap gallery in our application.
Regarding your first solution, adding them individually, I'm assuming you're referring to something like this?
require([ "esri/dijit/Basemap", ... ], function(Basemap, ... ) { var basemaps = []; var waterBasemap = new Basemap({ layers: [waterTemplateLayer], title: "Water Template", thumbnailUrl: "images/waterThumb.png" }); basemaps.push(waterBasemap); ... });
On the same API reference page (BasemapGallery | API Reference | ArcGIS API for JavaScript), there's some info on calling a basemap gallery group:
require([ "esri/map", "esri/dijit/BasemapGallery", "dojo/dom-construct", ... ], function(Map, BasemapGallery, domConstruct, ... ) { var map = new Map( ... ); var basemapGallery = new BasemapGallery({ showArcGISBasemaps: true, basemapsGroup: { owner: "esri", title: "Community Basemaps" }, map: map }, domConstruct.create('div')); ... });
According to the documentation:
The group can be defined by specifying either the id or the owner and title of the group. If all three parameters are defined only the id is used. If a valid basemapsGroup is defined then the value of showArcGISBasemaps is ignored and the default ArcGIS.com basemaps are not displayed.
Thanks for the input Chris Smith...I ended up making a modification from the default call:
var basemapGallery = new BasemapGallery({ showArcGISBasemaps: true, map: map, portalUrl: "http://myportal.arcgis.com" }, "basemapGallery"); basemapGallery.startup();
to add the basemapsGroup param like this:
var basemapGallery = new BasemapGallery({ map: map, basemapsGroup: { id: "my arcgis online group id" }, basemapIds: map.layerIds }, "basemapGallery"); basemapGallery.startup();
Problem solved.