Assign text color from attribute value

[dwold]

I am trying color text based on the name of an attribute. @jcarlson I tried following this post you did but the issue I am having is it is 1. assigning colors to the entire row and 2. not assigning the color to the event type I want (line 2). Any help would be greatly appreciated.

var c = $datapoint['event_type']

if(c == 'Exercise'){
    return {textColor:'#FDFF6D'}
} else if(c == 'Training'){
    return {textColor:'#FB1C53'}
} else if(c == 'Event Activation'){
    return {textColor:'#0F78B9'}
} else {
    return {textcolor:'#7CC88A'}
}

return {
  textColor: '',
  backgroundColor: '',
  separatorColor:'#adadad',
  selectionColor: '#fcfc86',
  selectionTextColor: '#fcfc86',
   attributes: {
     attribute1: c
   }
}

{field/event_name} {field/event_type}

{expression/attribute1}

I also tried this with no success...

var eventType = $datapoint.event_type;

var textColor;
if (eventType == 'Exercise') {
    textColor = '#ADFF8C';
} else if (eventType == 'Training') {
    textColor = '#FFC379';
} else if (eventType == 'Event Activation') {
    textColor = '#71C1FD';
} else {
    textColor = '#FD7F7F';
}

return {
  textColor: '',
  backgroundColor: '',
  separatorColor:'#adadad',
  selectionColor: '#fcfc86',
  selectionTextColor: '#fcfc86',
   attributes: {
     attribute1: textColor
   }
}

[jcarlson · Accepted solution]

In the line item template, you need to switch it to source, where you see the raw HTML, then put something like '<span style="color:{expression/attribute1}">{event_name} {event_type}</span>'.

[dwold]

@jcarlson thank you!!