topic Re: How to use lowercase and dynamic image placement in popups in ArcGIS JavaScript Maps SDK Questions

How to use lowercase and dynamic image placement in popups

JRomeo — Sun, 20 Jun 2021 20:12:06 GMT

Hi. I'd like to be able to:

1) Reference a field name e.g., {speciesname}

2) Change its value to all lowercase e.g., rana muscosa

3) Replace any whitespace with dashes e.g., rana-muscosa

4) Use that value (e.g., rana-muscosa.png) to display an image in the content portion of a popup template embedded in a table cell of my choice. Here's an example, which won't work but describes the desired result.

content: '<table><tr><td>{speciesname}</td><td><img src="images/' + "{speciesname}".toLowerCase().replace(/\s+/g, '-') + '.png"></td></tr></table>'

5) Can someone explain how to go about this? I've spent quite awhile in the docs and YT reviewing PopupTemplate and custom content reference and examples, to no avail. Thanks for any help.

Re: How to use lowercase and dynamic image placement in popups

DylanT_EsriCanada — Mon, 21 Jun 2021 06:35:05 GMT

Hi @JRomeo, have you tried looking into custom popup expressions with Arcade?

Re: How to use lowercase and dynamic image placement in popups

JRomeo — Tue, 22 Jun 2021 01:43:08 GMT

I have, yes, but I can't find any examples that really touch on what I'm looking to do. Thanks though.

Re: How to use lowercase and dynamic image placement in popups

Waffle_House — Tue, 22 Jun 2021 04:46:44 GMT

@JRomeo Have a look at the text functions for Arcade: https://developers.arcgis.com/arcade/function-reference/text_functions/

Particularly:

lower: makes your text lower case
trim: strips white space
concatenate: join up bits of text you make

You'll probably need to play around with it a bit. If you have some starting code to post we could help troubleshoot?