Creating a background color based on a field value using Arcade
Hello,
I'll start off by saying that I'm not very good at coding. Trying to think outside the box when I don't even know what the box is, is making for some difficult times, but I'm trying!
I'm trying to create a background color based on a field value using arcade, this is going in the Title location under pop-ups. I was able to create a box color for the text using HTML however that wasn't based on any values. The picture below is what I'm basically trying to accomplish. Each color matches the icons on the map
In Warranty = Purple
In Development Review = Yellow
Approved = Green
Under Construction = Orange
Any help would be greatly appreciated. I've looked at several guides and tried using the AI generator but didn't have much luck with either.
There's an ESRI blog that will help you on your way.
Spruce up your pop-ups with CSS
As well as this map; Flexbox CSS examples
I found them really useful I then created pop-ups that related directly to the symbology in a few maps I publish. For example, I publish an ownership map which contains 6 different status types, I can reflect the colour of the symbology within the pop-up. You will create a simple Arcade Expression for the symbology colours, then it's that reference that's added into your pop-up text box html.
Don't worry, the two example links makes it all quite clear and you can copy out the scripts used too.
Below is an example of what I did from the two pages linked;
Following is the code for the top text box;
The popup for this dataset is just a series of text boxes with either the code to create layouts or <hr> to create the line.
This is just part of the code for the rest of the pop-up. You can see, once you get your head around how the columns work, it's a case of copy/paste for your own use.
and finally, this is an example of the expression to define the colours.
(PS - I'm not a coder or anything like that, I just had ideas on what I want to do with pop-ups, so for those that know way more than me, please don't pick holes in what I've done .... 🙂 )
So I gave it a shot, and I had tried something similar to this yesterday and got the same results.
My titles look like this:
Clearly I'm doing something wrong but following all the examples, I don't know what.
So, whilst you can change the colours of Text Boxes in the pop-up, you can't change the pop-up Title background. As you can see, you can use that field for an expression return and you can see your expression working.
The colour management is in the Text Box HTML - as you can see by the full view of my pop-up.
