topic Advanced Formatting List in ArcGIS Dashboards Questions

Advanced Formatting List

BugPie — Fri, 06 Sep 2024 13:46:50 GMT

Hello out there! Looking for some guidance and hints on how to format a list. Specifically I'm looking to evaluate 5 different fields and then color the text for that line item based on the value. Where I get hung up is trying to evaluate more than 1 field and then applying to color to only that field in the line item layout. I Don't want all text to be a color just the value from that field, if that makes sense.

Seems like a long If then statement but I can't wrap my head around the structure.

I have a 5 fields for completion that has an integer between 0 and 100 and null.

In my list I have each of these five fields as well as some other fields and text.

Hoping to color the text for the field if 0-33 = red, 34 - 66 = yellow and 67 - 99 = green, all else black.

var comp1 = $datapoint.pc_1

var comp2 = $datapoint.pc_2

var comp3 = $datapoint.pc_3

var comp4 = $datapoint.pc_4

var comp5 = $datapoint.pc_5

Re: Advanced Formatting List

jcarlson — Fri, 06 Sep 2024 15:29:18 GMT

To get single lines to be colored differently, you'll need to use inline styling. Since you're doing the same color scaling to each field, this would be a good spot for a custom function:

function colorize(x) { var col = When( x < 34, 'red', x < 67, 'yellow', x < 100, 'green', 'black' ) return `<span style="color:${col}">${x}</span>` } return { attributes: { comp1: colorize($datapoint['comp1']), comp2: colorize($datapoint['comp2']), comp3: colorize($datapoint['comp3']), comp4: colorize($datapoint['comp4']), comp5: colorize($datapoint['comp5']) } }

Then in your line item template, bring the colorized text in "{expression/comp1}", etc.

Re: Advanced Formatting List

BugPie — Mon, 09 Sep 2024 18:02:17 GMT

Thank you @jcarlson I forgot about using "{expression/comp1}" as a way to call colorized text from the function. I need to take better notes from each of my projects but at least I'm getting better every time though. haha.