Using Arcade expressions to format specific values in Dashboard table field

[JimMiller3]

I've been working from both of these helpful posts about using Arcade to format values and cells in dashboard tables.

I've been able to do some things, such as formatting numbers and percentages. But I haven't been able to figure out how to bold specific values in a column and, for other values, change textAlign from left to center.

I can use displayText to make all values bold, or textAlign to make all values center aligned. My goal, though, is to make those changes for just certain values in the column.

Below is my desired output for the "Revenue Source" field. Thank you for any suggestions.

Revenue Source

Personal Income

Withholding

Other Pmts

Refunds

Corporation

Estimated Pmts

Other Pmts

All Other Revenue

Insurance

Tobacco

Other

[JenniferAcunto · Accepted solution]

You need to have your arcade statement return HTML that does your desired formatting. 

var bld = Concatenate('<strong>'+$datapoint.COUNTRY+'</strong>')

var lft = Concatenate('<div style="text-align: center;">' +$datapoint.COUNTRY+ '</div>')

var blft = Concatenate('<div style="text-align: center;"><strong>' +$datapoint.COUNTRY+ '</strong></div>')

var ctry = When($datapoint.COUNTRY == 'Cameroon', bld, $datapoint.COUNTRY == 'Angola', lft, $datapoint.COUNTRY == 'Ethiopia', blft,$datapoint.COUNTRY )

return {
  cells: {
    ADMIN1: {
      displayText : $datapoint.ADMIN1,
      textColor: '',
      backgroundColor: '',
      textAlign: 'left',
      iconName: '',
      iconAlign: '',
      iconColor: '',
      iconOutlineColor: ''
    },
		
    ADMIN2: {
      displayText : $datapoint.ADMIN2,
      textColor: '',
      backgroundColor: '',
      textAlign: 'left',
      iconName: '',
      iconAlign: '',
      iconColor: '',
      iconOutlineColor: ''
    },
		
    COUNTRY: {
      displayText : ctry,
      textColor: '',
      backgroundColor: '',
      textAlign: 'left',
      iconName: '',
      iconAlign: '',
      iconColor: '',
      iconOutlineColor: ''
    },
		
  }
}

[JimMiller3]

Thanks - that worked perfectly.

[JimMiller3]

A follow-up question to the solution above @JenniferAcunto : If I want to also bold the values in the "Actual" and "Forecast" fields that correspond with the bolded values in the "Revenue Source" field, how do I structure the HTML and Arcade expression? I've tried several ways but I'm not getting the desired result

This is my code:

var bld = Concatenate('<strong>'+$datapoint.revenue_source+'</strong>')

var rsrc=When($datapoint.revenue_source == 'Personal Income', bld, $datapoint.revenue_source == 'Corporation',$datapoint.revenue_source == 'Total',$datapoint.revenue_source == 'All Other Revenue'

return {
  cells: {
    revenue_source: {
      displayText : rsrc,
      hoverText: $datapoint.revenue_source,
      textColor: '',
      backgroundColor: '',
      textAlign: 'left',
      iconName: '',
      iconAlign: '',
      iconColor: '',
      iconOutlineColor: ''
    },

Actual: {
      displayText: Text($datapoint["Actual"], '$#,###; -$#,###'),
      textColor: '',
      backgroundColor: '',
      textAlign: 'right',
      iconName: '',
      iconAlign: '',
      iconColor: '',
      iconOutlineColor: ''
    },

Forecast: {
      displayText: Text($datapoint["Forecast"], '$#,###; -$#,###'),
      textColor: '',
      backgroundColor: '',
      textAlign: 'right',
      iconName: '',
      iconAlign: '',
      iconColor: '',
      iconOutlineColor: ''
    },

This is my desired result. Thank you.

Revenue Source	Actual	Forecast
Personal Income	100	50
Withholding	25	25
Other Pmts	25	20
Refunds	50	5
Corporation	200	100
Estimated Pmts	100	50
Other Pmts	100	50
All Other Revenue	300	500
Total	600	650