Format FeatureLayer label text

[FabricioBezerra]

Using ArcGIS JS API 4.23.

I would like to dynamically format the labels of a FeatureLayer based on a set of rules. These rules would result in parts of the label text being italicized.

Rules for parts of the text that should not be italicized (just for example purposes):

• Text between single quotes, brackets, or parentheses

Eg.:  Abelia x grandiflora [Hopleys™] = 'Abghop'

I was able to create the logic to format the text correctly in Javascript and apply it to the react components but would like to apply it to the labels as well.

My idea was to use Arcade Expression to recreate the logic I have in Javascript to format the label text based on its results but I wasn't able to italicize partially the text of the FeatureLayer labels.

I did some research and saw that you are able to do that in ArcGIS PRO using XML tags. Is there a way to do that or to achieve the same result using the JS API?

[AshleyPeters]

Fabricio,

Did you find a solution to this? I am using an Arcade Expression to generate a list of species (common name, scientific name, and protection status) in JavaScript, but have not yet been able to figure out how to italicize just the species name.

Any insight you may have would be appreciated.

Ashley

[FabricioBezerra]

Hi Ashley,

I’ve found a workaround for the problem. Not sure if it will work for you but it did for me.
I basically overlapped two LabelClass instances. One italic and the other non-italic using a monospaced font.

Here are the steps I’ve followed to achieve the solution:

• Set two different LabelClass instances to the labelingInfo property of the FeatureLayer.
  - Use a monospaced font, which has every character (including the space) with the same width, for both LabelClass instances
  - One instance will have italicized font
  - The other instance will have the non-italicized font
• Create the logic using Arcade Expression
  - For the italicized label class instance, create the necessary logic to replace the non-italic parts of the label value with spaces
  - For the non-italic label class instance, create the necessary logic to replace the italic parts of the label value with spaces
• Set xoffset and yoffset properties to overlap both LabelClass instances

I've attached an image of the result.

I hope this helps.

Fabricio