Use of Bold in Arcade Expressions

JennHat

Hello,

I'm displaying a number of attributes in a list. I want to bold the attribute titles like so:

Location ID: 110611
Description: Yorktown Shops 
Facility Status: Operating
Asset Code: 7100

Because there's 20+ attributes that will be displayed, I don't want to use HTML codes in a text box and create 20+ expressions. I'm also producing it for someone else to copy and paste the code, so I can't just make it in Pro. 

I tried to use the following that I saw in another post, but it kept thinking it was a dictionary and it made a table, with the bold tags displaying as text. Any ideas?

 

var Location = $feature.LOCATION;
var Description = $feature.DESCRIPTION;
var Facility_Status= Proper($feature.STATUS);
var Asset_Code = $feature.ASSET_CODE;


return {
  type : "text",
  text : `<b>Location ID:</b> ${Location}`
}

 

 

jcarlson

This seems to work just fine over here.

 

You could try using inline style tags, see if that works? I like using <style> anyway, because you can modify the text a lot more.

If you want to keep the code concise, and you're just making certain text bold, you could try a custom function, too. Maybe overkill just for bolding the text, but if you are doing something with a lot of custom style tagging, it's helpful to put the styling in a function or a variable so that you can adjust everything all at once.

function makeItBold(label, attribute){
  return `<span style="font-weight:bold">${label}</span>: ${attribute}`
}

return {
  type: 'text',
  text: `${makeItBold('Location ID', $feature['LOCATION'])}<br>
${makeItBold('Description', $feature['DESCRIPTION'])}`
}