0

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); });
  • 1
    Please edit your post -- the code is unreadable. There is a code button, or you can indent each line by 4 spaces. – John Powell Jul 29 '15 at 9:48
  • What is the error or issue? Also, looks like the Basemap widget has lowercase 'm'. ["esri/dijit/Basemap"]. – timlohnes Jul 29 '15 at 16:01
  • 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. – timlohnes Jul 29 '15 at 16:45
2

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();
  • Dear Tim Lohnes. – J Rao Jul 30 '15 at 1:48
  • 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"]. – J Rao Jul 30 '15 at 1:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.