Search code examples
javascriptarcgisinfowindowesriarcgis-js-api

Esri InfoWindow not showing results returned


I was having some problem when trying to retrieve data and show them onto the infoWindow using ArcGIS. Here is my javascript:

var map;
require(["esri/map","esri/dijit/Scalebar","esri/layers/FeatureLayer", "esri/dijit/Legend", 
     "dojo/_base/array", "dojo/parser", 
     "dijit/layout/BorderContainer", "dijit/layout/ContentPane", 
     "dijit/layout/AccordionContainer","esri/InfoTemplate","dojo/dom-construct","dojo/domReady!"], 
     function(Map,Scalebar, FeatureLayer, Legend, arrayUtils, parser, InfoTemplate,domConstruct){
    parser.parse();
    map=new Map("map", {
    center:[-56.049, 38.485],
    zoom:3,
    basemap: "topo"});

// Show legend
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();
}
});

var legendFeature = new 
     FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3", { 
     mode: FeatureLayer.MODE_ONDEMAND, 
     outFields:["*"] 
     });

// Show infoWindow 
var content = "<b>State</b>: ${STATE_NAME}";
var infoTemplate = new InfoTemplate("${STATE_NAME}", content);
            featureLayer = new FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3",
            {
                mode: FeatureLayer.MODE_ONDEMAND,
                infoTemplate: infoTemplate,
                outFields: ["*"]
            });
map.addLayers([featureLayer]);

// Show scalebar
var scalebar = new Scalebar({
    map:map,
    scalebarUnit: "dual",
    attachTo:"bottom-left"});
});

There is no problem with legends and scalebar. However, when I click on certain region, it did popped out with an infoWindow but with no results on it. I wonder why it does not work.

Thanks in advance.


Solution

  • The order of AMD modules you are requiring must correspond to the order of the constructors you obtain. In your case InfoTemplate corresponds to "dijit/layout/BorderContainer":

      require(["esri/map", "esri/dijit/Scalebar", "esri/layers/FeatureLayer", "esri/dijit/Legend",
             "dojo/_base/array", "dojo/parser",
             "dijit/layout/BorderContainer", "dijit/layout/ContentPane",
             "dijit/layout/AccordionContainer", "esri/InfoTemplate", "dojo/dom-construct", "dojo/domReady!"],
             function (Map, Scalebar, FeatureLayer, Legend, arrayUtils, parser, InfoTemplate, domConstruct) {...
    

    This will work:

       require(["esri/map", "esri/dijit/Scalebar", "esri/layers/FeatureLayer", "esri/dijit/Legend",
             "dojo/_base/array", "dojo/parser",
             "dijit/layout/BorderContainer", "dijit/layout/ContentPane",
             "dijit/layout/AccordionContainer", "esri/InfoTemplate", "dojo/dom-construct", "dojo/domReady!"],
             function (Map, Scalebar, FeatureLayer, Legend, arrayUtils, parser, BorderContainer, ContentPane, AccordionContainer,  InfoTemplate, domConstruct) {...