nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Whats wrong with my logic?

RachelAlbritton

I am trying to set the contents of an infoTemplate based on an if/else statement, however, its not giving me the results that I would expect. Certain fields in the 'thumbnails' field contain a field that is call 'NoImage2.jpg'. If the field contains this title I want this field removed from the infotemplate window. When I test the logic, the infotemplate always returns the else statement. If I remove the else statement and have the function only evaluate the if statement, the windows comeback blank, even for the objects that it should apply to. I'm clearly overlooking something but I can't figure it out. Thanks in advance.

 map = new Map("map",{
          basemap: "streets",
          center:[-111.836, 40.765], //long, lat
          zoom: 14
        });
            
            bldgContentObject = {
            objectid: '${OBJECTID}',
            formalName: '"${formal_name:formatStructureNameForThumbnailModal}"',
            informalName: '"${informal_name:formatStructureNameForThumbnailModal}"',
            streetAddress: '${street_address}',
            city: '${city}',
            state: '${state}',
            zipCode: '${zip_code}',
            thumbnails: '${thumbnails}',
            buildingNumber: '${building_number}',
            abbreviation: '${abbreviation}',
            lattitude: '${lattitude:gsvLat}',
            longitude: '${longitude:gsvLon}',
            gsvHeading: '${gsv_heading:gsvHeading}',
            gsvPitch: '${gsv_pitch:gsvPitch}'
          };
          
        symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL,
        new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID)); //new Color([0,0,0])), new Color([0,0,0]));
        //infoTemplate = new InfoTemplate("${informal_name}", "<b>BN: </b>${building_number}<br><b>Abbrv: </b>${abbreviation}<br><b>Thumbnail: </b>${thumbnails}<br>");
        
        infoTemplate = new InfoTemplate();
        infoTemplate.setTitle (bldgContentObject.informalName);
        var infoContent1 = "<b>BN: </b>"+bldgContentObject.buildingNumber+"<br><b>Thumbnail: </b>"+bldgContentObject.thumbnails;
      var infoContent2 = "<b>BN: </b>"+bldgContentObject.buildingNumber;
        //infoTemplate.setContent("<b>BN: </b>${building_number}<br><b>Abbrv: </b>${abbreviation}<br><b>Thumbnail: </b>${thumbnails}<br>"); //Works
        //infoTemplate.setContent(infoContent1); //This logic works
        infoTemplate.setContent(templateContent());
    
        function templateContent (){
    //return bldgContentObject.thumbnails; //name in the thumbnails field (string)
        if (bldgContentObject.thumbnails === "'NoImage2.jpg'"){return infoContent2;} //returns a content window with only the title
        //if (bldgContentObject.thumbnails === "NoImage2.jpg"){return infoContent2;}) //same results as above
        //if bldgContentObject.thumbnails === '"NoImage2.jpg"'){return infoContent2;}// same results as above
    else {return infoContent1;}
        
        }
        
        map.on("click", doQuery);
        
        queryTask = new QueryTask("http://fmags.fm.utah.edu/arcgis/rest/services/mapservices/public_basemap_2014/MapServer/41");
        queryTask.on("complete", addToMap);
           
        query = new Query();
        query.returnGeometry = true;
        query.outFields = ["*"];
           
      });
      
          function doQuery(evt) {
        //clear currently displayed results
        map.graphics.clear();
               
        query.geometry = evt.mapPoint;
            query.outSpatialReference  = map.spatialReference;
        queryTask.execute(query);
          }
            
        function addToMap(results) {           
        var featureArray = results.featureSet.features;
            var feature = featureArray[0];          
            map.graphics.add(feature.setSymbol(symbol).setInfoTemplate(infoTemplate));
      }
    </script>
  </head>

  <body>
    <div id="map"></div>
  </body>
</html>

Finde mehr Beiträge mit dem Tag

Accepted answers

rscheitlin

Rachael,

You should look at the help docs for formatting infowindow content, specifically

Using custom functions:

Format info window content | Guide | ArcGIS API for JavaScript

Your line

infoTemplate.setContent(templateContent());

should be:

infoTemplate.setContent(templateContent);

and in your

function templateContent (){

function you need to work with the graphic.

function templateContent (graphic){

var attrs = graphic.attributes;

All comments

RachelAlbritton

Robert -

Sorry for the delayed response - following all of your advice I melded a few of the methods together and I got it to work:

//Create infoTemplate

infoTemplate = new InfoTemplate("${informal_name}",infoContent);

function infoContent (graphic){

if (graphic.attributes.thumbnails === "NoImage2.jpg")

{content = "BN: "+graphic.attributes.building_number+" Abbrv: "+graphic.attributes.abbreviation+" ";}

else

{content = "BN: "+graphic.attributes.building_number+" Abbrv: "+graphic.attributes.abbreviation+" Photo Name: "+graphic.attributes.thumbnails;}

console.log(graphic.attributes.thumbnails);

return content;

}

The resource page you linked me to (Format info window content | Guide | ArcGIS API for JavaScript ) was especially helpfull as well. It just took some time reading and reading all the examples.

Thank you for your help!

rscheitlin

Rachel,

Try adding in a console.info in the function then.

function templateContent (graphic){

console.info(graphic.attributes.thumbnails);

if (graphic.attributes.thumbnails === "NoImage2.jpg"){

return infoContent2;

} else {

return infoContent1;

}

RachelAlbritton

Thanks for the suggestion, but it still doesn't work. The popup gives me the title, but the content window just says "no information available"

rscheitlin

Rachel,

OK, keep the setContent the way you had it but update your function to this and see if it works for you:

function templateContent (graphic){     
    if (graphic.attributes.thumbnails === "NoImage2.jpg"){
        return infoContent2;
    } else {
        return infoContent1;
    } 
}

RachelAlbritton

Robert -

the images I posted were simply to show you that keeping my format : infoTemplate.setContent(templateContent());

gives my attribute information, but your suggestion of infoTemplate.setContent(templateContent); does not.

Keeping things within context, if I run the code using my format of infoTemplate.setContent(templateContent());

The following image defaults to infoConent1, but it should be recognizing infoContent2

if I use your suggested format: infoTemplate.setContent(templateContent); it still defaults to the infoContent1 (which it should not), but it does not give me the attribute value

I hope this provides some clarity.

rscheitlin

Rachel,

Why either one of those images is displaying the thumbnail info does not make any sense to me. Supposedly your function is returning infoContent2. And infoContent2 should be "BN: "+bldgContentObject.buildingNumber. Have you changed your code since you posted what you did above to account for this difference in what code we can see and what is actually running on your end?

RachelAlbritton

My mistake - thats a mistype and I've edited the original post (thank you for catching that).

It should read:

if (bldgContentObject.thumbnails === "'NoImage2.jpg'"){return infoContent2;}

else {return infoContent1;}

kenbuja

Then what is the purpose of infoContent1?

RachelAlbritton

thanks Robert - I'll take a look at the link you provided

As far as your suggestion for this:

Your line
infoTemplate.setContent(templateContent());
should be:
infoTemplate.setContent(templateContent);

I tried that, but your suggestion returns this:

whereas my statement returns the field value:

RachelAlbritton

correct

rscheitlin

Rachael,

You should look at the help docs for formatting infowindow content, specifically

Using custom functions:

Format info window content | Guide | ArcGIS API for JavaScript

Your line

infoTemplate.setContent(templateContent());

should be:

infoTemplate.setContent(templateContent);

and in your

function templateContent (){

function you need to work with the graphic.

function templateContent (graphic){

var attrs = graphic.attributes;

kenbuja

The if and else if statements both return infoContent2. Is that correct?

if (bldgContentObject.thumbnails === "'NoImage2.jpg'"){return infoContent2;}
else {return infoContent2;}

Nimm an der Unterhaltung teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.