Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am attempting to implement the basemapGallery code found in the API samples here.

There seems to be an issue with the TitlePane into which my basemapGallery is nested. It simply does not render. The basemapGallery appears in place and works as expected, but since the TitlePane does not exist in the app, it is not appearing as a child within the TitlePane, and instead just sits there, with no way to collapse.

Like the sample code, the basemapGallery is being created programmatically and the TitlePane is being created declaratively. Here is the JS code:

function init() {

var popup = new esri.dijit.Popup({
selectionSymbol: new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, new dojo.Color([255,0,0]))}, dojo.create("div"));

map = new esri.Map("map", {
    basemap: "topo",
    extent: new esri.geometry.Extent({xmin:-11420303.522028634,ymin:3387689.093598152,xmax:-6939259.175839653,ymax:6114962.262812516,spatialReference:{wkid:102100}}), 
    infoWindow: popup

dojo.connect(map, "onLoad", mapReady);

var basemapGallery = new esri.dijit.BasemapGallery({
    showArcGISBasemaps: true,
    map: map
}, "basemapGallery");

dojo.connect(basemapGallery, "onError", function(msg) {console.log(msg)});


And the HTML:

<div style="position:absolute; right:20px; top:10px; z-index:999;">
    <div id="basemapSelector" data-dojo-type="dijit.TitlePane" data-dojo-props="title:'Switch Basemap', closable:false, open:false">
        <div data-dojo-type="dijit.layout.ContentPane" style="width:380px; height:280px; overflow:auto;">
        <div id="basemapGallery" ></div></div>

Notes: I am using v3.3 of the API. I am referencing the claro.css stylesheet. I have included dojo.require("dijit.TitlePane"); I have included a screencap of what I see.

basemapGallery rendering without parent TitlePane

share|improve this question
up vote 1 down vote accepted

Figured it out! The problem was in the HTML - I was referencing the the API and the JS file that contained all my JS before the dojoConfig object was defined. One I moved those references below the dojoConfig object (and removed async: true from its properties), the TitlePane worked just fine.

So always make sure those script tags referencing the API and any separate JS file are placed after the script tag containing dojoConfig.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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