Question

I am trying to load a basic ESRI ArcGIS map in a GWT project. The javascript ArcGIS API is written in Dojo, and seems to require you to use dojo.addOnLoad() to make sure the code that initializes the map object doesn’t run until after the ArcGIS API is fully initialized. The code looks like this:

    var map;        
    dojo.require("esri.Map");
    function init() {
        map = new esri.Map("mapDiv");
        var basemapURL= "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer";
        var basemap = new esri.layers.ArcGISTiledMapServiceLayer(basemapURL);
        map.addLayer(basemap);
    }
    dojo.addOnLoad(init);

The problem is that when I use this code in a GWT project, it never calls the function I passed into dojo.addOnLoad. The map never gets initialized and never shows up. I have verified with Firebug that the addOnLoad() is being called but init() is not.

I tried working around this by calling init() from GWT code in a timer, which works, but only around 50% of the time. The rest of the time I get the error “TypeError: dojox.gfx.createSurface is not a function,” so I’m pretty sure I’m creating a race condition when I do that.

Running the project in developer mode in Eclipse or hosting the compiled project in Tomcat makes no difference.

Answer 1

In this case, Dojo isn’t looking for an actual named function function init(), but rather a variable that contains a function var init = function() {...}.

What you want to do is this:

var map;        
dojo.require("esri.Map");
var init = function() {
  map = new esri.Map("mapDiv");
  var basemapURL= "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer";
  var basemap = new esri.layers.ArcGISTiledMapServiceLayer(basemapURL);
  map.addLayer(basemap);
}

dojo.addOnLoad(init);