Hi There,
I have been looking at using the Esri ArcGIS api. I haven't done dojo before and have run into an issue.
Im looking at using the basemapGallery, when isolated this works fine:
var map;
require([
"esri/map", "esri/dijit/BasemapGallery", "esri/arcgis/utils",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane",
"dojo/domReady!"
], function(
Map, BasemapGallery, arcgisUtils
) {
map = new Map("map", {
basemap: "topo",
center: [-105.255, 40.022],
zoom: 13
});
//add the basemap gallery, in this case we'll display maps from ArcGIS.com including bing maps
var basemapGallery = new BasemapGallery({
showArcGISBasemaps: true,
map: map
}, "basemapGallery");
basemapGallery.startup();
basemapGallery.on("error", function(msg) {
console.log("basemap gallery error: ", msg);
});
});
but when I combine it with my code i get the following error "Uncaught Error: Target must be an event emitter"
var map;
require([
"esri/map", "esri/InfoTemplate", "esri/Color", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/dijit/BasemapGallery", "esri/arcgis/utils",
"dojo/dom", "dojo/dom-class", "dojo/dom-construct", "dojo/on", "dojo/query", "dojo/domReady!" ],
function(
Map, InfoTemplate, Color, ArcGISDynamicMapServiceLayer, ImageParameters, dom, domClass, domConstruct, on, query, BasemapGallery, arcgisUtils
) {
var layer, visibleLayerIds = [];
map = new Map("map", {
center: [ -0.181710, 52.328117 ],
zoom: 12,
basemap: "osm",
infoWindow: infoWindow
});
//add the basemap gallery, in this case we'll display maps from ArcGIS.com including bing maps
var basemapGallery = new BasemapGallery({
showArcGISBasemaps: true,
map: map
}, "basemapGallery");
basemapGallery.startup();
basemapGallery.on("error", function(msg) {
console.log("basemap gallery error: ", msg);
});
MORE CODE....
Any help, or suggestions towards the solution would be gratefully recieved. Let me know if you need any more information.
Trevor
Solved! Go to Solution.
Trevor,
Your requires and variables must line up in your code.
you have:
require([ "esri/map", "esri/InfoTemplate", "esri/Color", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/dijit/BasemapGallery", "esri/arcgis/utils", "dojo/dom", "dojo/dom-class", "dojo/dom-construct", "dojo/on", "dojo/query", "dojo/domReady!" ], function( Map, InfoTemplate, Color, ArcGISDynamicMapServiceLayer, ImageParameters, dom, domClass, domConstruct, on, query, BasemapGallery, arcgisUtils ) {
Should be:
require([ "esri/map", "esri/InfoTemplate", "esri/Color", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/dijit/BasemapGallery", "esri/arcgis/utils", "dojo/dom", "dojo/dom-class", "dojo/dom-construct", "dojo/on", "dojo/query", "dojo/domReady!" ], function( Map, InfoTemplate, Color, ArcGISDynamicMapServiceLayer, ImageParameters, BasemapGallery, arcgisUtils, dom, domClass, domConstruct, on, query ) {
Trevor,
Your requires and variables must line up in your code.
you have:
require([ "esri/map", "esri/InfoTemplate", "esri/Color", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/dijit/BasemapGallery", "esri/arcgis/utils", "dojo/dom", "dojo/dom-class", "dojo/dom-construct", "dojo/on", "dojo/query", "dojo/domReady!" ], function( Map, InfoTemplate, Color, ArcGISDynamicMapServiceLayer, ImageParameters, dom, domClass, domConstruct, on, query, BasemapGallery, arcgisUtils ) {
Should be:
require([ "esri/map", "esri/InfoTemplate", "esri/Color", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/dijit/BasemapGallery", "esri/arcgis/utils", "dojo/dom", "dojo/dom-class", "dojo/dom-construct", "dojo/on", "dojo/query", "dojo/domReady!" ], function( Map, InfoTemplate, Color, ArcGISDynamicMapServiceLayer, ImageParameters, BasemapGallery, arcgisUtils, dom, domClass, domConstruct, on, query ) {
That's because you don't have agreement between the modules in your require and the variable names in the function
require(["esri/map", "esri/InfoTemplate", "esri/Color", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/dijit/BasemapGallery", "esri/arcgis/utils", "dojo/dom", "dojo/dom-class", "dojo/dom-construct", "dojo/on", "dojo/query", "dojo/domReady!" ], function(Map, InfoTemplate, Color, ArcGISDynamicMapServiceLayer, ImageParameters, BasemapGallery, arcgisUtils, dom, domClass, domConstruct, on, query
Sorry I cannot mark to answers as correct, but you are spot on as well!
Thanks guys! I'm not super clear on why that's the case. But it worked, I'm not going to start looking at why that worked
Thanks!
Trev
Trevor,
The reason is simple the require list tells dojo what modules are required in your code and each of those modules get a variable defined for it, so if you require esri/map, esri/InfoTemplate and then have your variables InfoTemplate,Map then what you are saying is that the InfoTemplate variable equals the map module and the Map variable equals the InfoTemplate module. Now in your code you try and do something with Map like Map.getScale, well an InfoTemplate does not have a getScale function.
You might want to look at this blog on AMD: The abc’s of AMD | ArcGIS Blog
The most important thing to remember is that the arguments are positional, which means that you have to be careful to ensure that your argument names are listed in the same order that you loaded your modules. If this isn’t done your variables won’t refer to the module you expect them to.
Thanks for the tips guys! I'll take a look.