Defining custom basemap gallery in ArcGIS API for JavaScript?

Question

I'm using arcgis js spi for 3.13 edition, when I using basemaptoggle widget from https://developers.arcgis.com/javascript/jssamples/widget_basemap.html is ok, but when defining my own basemap is doesn't work, the codes are following below, hopefully some one who can help to solve it.

var basemaps[];
//one step define BasemapLayer
 var basemaps = [];
 var fx_image =new esri.dijit.BasemapLayer({
 url: "----"
 });
//second step define BaseMap
 var imageBaseMap1 = new esri.dijit.BaseMap({
 layers: [fx_image],
 title: "fx_image",
 thumbnailUrl: "esri/images/basemap/terrain.jpg"
 });
 basemaps.push(imageBaseMap1);
//another basemap
 var fx_sl = new esri.dijit.BasemapLayer({
 url: "----"
 });
 var imageBaseMap2 = new esri.dijit.BaseMap({
 layers: [fx_sl],
 title: "fx_sl",
 thumbnailUrl: "esri/images/basemap/hybrid.jpg"
 });
 basemaps.push(imageBaseMap2);
 //third step define BaseMapGallery
 var basemapGallery = new esri.dijit.BasemapGallery({
 showArcGISBasemaps: false,
 basemaps: basemaps,
 map: map
 }, "basemapGallery");
 basemapGallery.startup();
 basemapGallery.on("error", function (msg) {
 console.log("basemap gallery error: ", msg);
 });

---

Sorry for the unreadable code, here is the normal sequence

var basemaps[]; 
//one step define BasemapLayer
var fx_image =new esri.dijit.BasemapLayer({url:"http://services.arcgisonline.com/ArcGIS/rest/services/Specialty/DeLorme_World_Base_Map/MapServer" });
 //second step define BaseMap 
var imageBaseMap1 = new esri.dijit.BaseMap({layers: [fx_image], title:"fx_image", thumbnailUrl: "esri/images/basemap/terrain.jpg"}); 
basemaps.push(imageBaseMap1); 
//another basemap 
var fx_sl = new esri.dijit.BasemapLayer({url:"http://services.arcgisonline.com/arcgis/rest/services/Specialty/Soil_Survey_Map/MapServer"}); 
var imageBaseMap2 = new esri.dijit.BaseMap({layers: [fx_sl],title:"fx_sl",thumbnailUrl: "esri/images/basemap/hybrid.jpg"}); 
basemaps.push(imageBaseMap2); 
//third step define BaseMapGallery 
var basemapGallery = new esri.dijit.BasemapGallery({showArcGISBasemaps:false,basemaps: basemaps,map:map }, "basemapGallery"); basemapGallery.startup(); 
basemapGallery.on("error", function (msg){ console.log("basemap gallery error: ", msg); });

• John Powell: Please edit your post -- the code is unreadable. There is a code button, or you can indent each line by 4 spaces.
• timlohnes: What is the error or issue? Also, looks like the Basemap widget has lowercase 'm'. ["esri/dijit/Basemap"].
• timlohnes: Also your comment says BasemapToggle, but the sample link and your code indicate BasemapGallery. Which are you trying to do? My code below is for a custom gallery.

Answer 1

I just separated it out a little bit, create each basemap separately and then add to the gallery. Try this.

 var fx_image =new BasemapLayer({url:"http://services.arcgisonline.com/ArcGIS/rest/services/Specialty/DeLorme_World_Base_Map/MapServer" });
 var basemap = new Basemap({
 layers: [fx_image],
 title: "fx_image",
 thumbnailUrl: "esri/images/basemap/terrain.jpg"
 })
 var fx_sl = new BasemapLayer({url:"http://services.arcgisonline.com/arcgis/rest/services/Specialty/Soil_Survey_Map/MapServer"});
 var basemap2 = new Basemap({
 layers: [fx_sl],
 title: "fx_sl",
 thumbnailUrl: "esri/images/basemap/hybrid.jpg"
 })
 var basemapGallery = new BasemapGallery({
 showArcGISBasemaps: false,
 //basemaps: basemaps,
 map: map
 }, "basemapGallery");
 basemapGallery.add(basemap);
 basemapGallery.add(basemap2);
 basemapGallery.startup();

• J Rao: Dear Tim Lohnes.
• J Rao: Dear Tim Lohnes. Yes, your suggestion is wonderful. your code works well. I find the mistake in my codes. for example: When I define and basemap layer like fx_image, Using statement: var fx_image=new esri.dijit.BasemapLayer(url); error message shows "esri.dijit.BasemapLayer is not a constructor", type "esri/dijit/BasemapLayer" and "BasemapLayer" inner dojo "require" and function respectively, then using var fx_image=new BasemapLayer(url); that's ok. Tanks for you help and reminding me lower case "m" in ["esri/dijit/Basemap"].