Getting BaseMapToggle error from ArcGIS API for JavaScript?

Question 1

I'm having a problem with my Web Application. I try to fit in a legend and a BasemapToggle but it doesn't seem to work.

My Code looks like this:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
 
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css">
<link rel="stylesheet" href="http://192.168.163.129:6080/arcgis/rest/static/jsapi.css">
<script src="http://js.arcgis.com/3.8/"></script>
<script>
var map;
require([
 "esri/map", 
 "esri/dijit/Legend",
 "esri/dijit/BasemapGallery",
 "esri/arcgis/utils",
 "dojo/_base/array", 
 "dojo/parser",
 "dijit/layout/BorderContainer", 
 "dijit/layout/ContentPane", 
 "dijit/layout/AccordionContainer", 
 "dojo/domReady!",
 ],
function(Map, Legend, arrayUtils, BasemapGallery, arcgisUtils, parser) 
 {
 parser.parse();
 map = new esri.Map("map", {basemap: "topo", center: [10.8, 48.55], zoom: 9});
 
 var raum = new esri.layers.ArcGISDynamicMapServiceLayer("http://192.168.163.129:6080/arcgis/rest/services/Masterarbeit/MapServer", {opacity: 0.85});
 map.addLayer(raum);
 
 dojo.connect(map, 'onLayersAddResult', function(results){
 var layerInfo = new esri/dijit/Legend({
 map: map,
 layerInfos: {layer:raum, title:"Raumkategorien"},
 arrangement:esri/dijit/Legend/ALIGN_LEFT
 }, "legendDiv");
 layerInfo.startup();
 });
 
 
 var basemapGallery = new BasemapGallery({
 showArcGISBasemaps: true,
 map: map
 }, "basemapGallery");
 basemapGallery.startup();
 
 
 });
</script> 
</head> 
<body class="tundra"> 
<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 100%; margin: 0;"> 
 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" id="navtable" style="background-image:url(http://192.168.163.129/Energiewende/master_1.png); width: 100%; height: 100px; z-index: 0"> 
 <div style="float:left;" id="breadcrumbs"><font color="white" face="Helvetica" size="6">Test Viewer</font><br><font color="white" face="Helvetica">Name here</font></div> 
 <div style="position:absolute; top:10px; right:10px" id="help"><a href="http://www.geo.uni-augsburg.de" target="_blank"><img src="IGUA-RGB_200x126.jpg" width="134" height="80" alt="Institut für Geographie - Universitaet Augsburg"></a></div> 
 </div> 
 <div id="leftPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'left'" style="width:15%">
 <div data-dojo-type="dijit/layout/AccordionContainer">
 <div data-dojo-type="dijit/layout/ContentPane" id="legendPane" data-dojo-props="title:'Legende', selected:true">
 <div id="legendDiv"></div>
 </div>
 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title:'Tools here!'">Tools here!
 </div>
 </div>
 </div>
 <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" style="padding:0">
 <!--<div style="position:absolute; right:20px; top:10px">
 <div 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>
 </div>
 </div>-->
 </div> 
</div> 
</body>
</html>

So, if I'm using this code i get this result: enter image description here

There's no content showing up in the LegendPane. And if i undo the uncommented -part for the BasemapToggle it looks like this:

enter image description here

Does someone might have a hint or an answer for me?

Question 2

When using AMD, the order of the arguments in the function have to match how the modules are loaded. You have several out of order

require([
 "esri/map", 
 "esri/dijit/Legend",
 "esri/dijit/BasemapGallery",
 "esri/arcgis/utils",
 "dojo/_base/array", 
 "dojo/parser",
 "dijit/layout/BorderContainer", 
 "dijit/layout/ContentPane", 
 "dijit/layout/AccordionContainer", 
 "dojo/domReady!",
],
function(Map, Legend, BasemapGallery, arcgisUtils, arrayUtils, parser)

Take a look at this blog posting for more information

Question 3

Thanks for your correction. That already helped for the BasemapGallery, but my legend doesn't work at all. Is there maybe an error in the code for loading the legend?

Question 4

I couldn't get your code working, but made something similar: jsbin.com/mupir/1/edit?html,output

Question 5

that's just fine. thank you very much. i added the part with legendLayers.push in my code and it works just fine

Question 6

Glad to hear that. You should mark this question as answered.

Question 7

Realized this is really old, but you could try something like this for those looking at this now.

// Creates the Legend from list of Feature Classes shown on map
 // Dynamically changes depening on scale and what features are visible
 map.on("layers-add-result", function(evt) {
 var layerInfo = arrayUtils.map(evt.layers, function(layer, index) {
 return {
 layer: layer.layer,
 title: layer.layer.name
 };
 });
 if (layerInfo.length > 0) {
 var legendDijit = new Legend({
 map: map,
 layerInfos: layerInfo
 }, "legendDiv");
 legendDijit.startup();
 }
 });

kenbuja kenbuja 5,9152 gold badges20 silver badges31 bronze badges · Accepted Answer · 2014-03-19 13:23:01Z

2

When using AMD, the order of the arguments in the function have to match how the modules are loaded. You have several out of order

require([
 "esri/map", 
 "esri/dijit/Legend",
 "esri/dijit/BasemapGallery",
 "esri/arcgis/utils",
 "dojo/_base/array", 
 "dojo/parser",
 "dijit/layout/BorderContainer", 
 "dijit/layout/ContentPane", 
 "dijit/layout/AccordionContainer", 
 "dojo/domReady!",
],
function(Map, Legend, BasemapGallery, arcgisUtils, arrayUtils, parser)

Take a look at this blog posting for more information

Share

Improve this answer

answered Mar 19, 2014 at 13:23

kenbuja's user avatar

kenbuja kenbuja

5,9152 gold badges20 silver badges31 bronze badges

4

Thanks for your correction. That already helped for the BasemapGallery, but my legend doesn't work at all. Is there maybe an error in the code for loading the legend?

Simmal
– Simmal

2014年03月19日 18:24:10 +00:00
Commented Mar 19, 2014 at 18:24
1

I couldn't get your code working, but made something similar: jsbin.com/mupir/1/edit?html,output

kenbuja
– kenbuja

2014年03月19日 21:24:39 +00:00
Commented Mar 19, 2014 at 21:24
that's just fine. thank you very much. i added the part with legendLayers.push in my code and it works just fine

Simmal
– Simmal

2014年03月19日 23:26:10 +00:00
Commented Mar 19, 2014 at 23:26
Glad to hear that. You should mark this question as answered.

kenbuja
– kenbuja

2014年03月20日 12:39:31 +00:00
Commented Mar 20, 2014 at 12:39

Add a comment |

Stack Exchange Network

Getting BaseMapToggle error from ArcGIS API for JavaScript?

2 Answers 2

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Hot Network Questions

Getting BaseMapToggle error from ArcGIS API for JavaScript?

2 Answers 2

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Related

Hot Network Questions