topic Re: Wrap/stack a text string label in an AGOL web map in ArcGIS Online Questions

Wrap/stack a text string label in an AGOL web map

JayHodny — Tue, 01 Feb 2022 20:23:05 GMT

Hello. I have labels using an attribute text string that I would like to "wrap and stack" on my web map. In Pro, I am able to do this using Labeling Properties (see screen shot). I published the service but the labeling itself did not carry through to the service (maybe I missed a setting in the Share Web Layer?).

I read that classic map viewer does not support the idea but the new map viewer does (maybe)? I opened my web map in the new map viewer and poked around on the Label features dialogue but was not successful.

I am an Arcade beginner, but was wondering if there is an arcade function or code snippet available to do this, for example, wrap and stack the text string at the first space in the string? Thanks!

Re: Wrap/stack a text string label in an AGOL web map

RussRoberts — Wed, 02 Feb 2022 14:10:19 GMT

Yup it is supported in New Map Viewer. Here is a sample web map

https://jsapi.maps.arcgis.com/apps/mapviewer/index.html?webmap=a4e63c4987b543d790cd1f28b801cc3f

And an article on how to create this

https://support.esri.com/en/technical-article/000025694

Re: Wrap/stack a text string label in an AGOL web map

JayHodny — Wed, 02 Feb 2022 17:26:53 GMT

Hello. Many thanks for your reply. I had reviewed the article you refer too prior to my post. If I am not mistaken, the workflow described therein is to stack values from multiple fields to create the feature labels using the new map viewer. In my case, I have one field (screen shot) with text string choices that I want to split and stack or word-wrap and stack (I don't know of a better way to call this idea). I will revisit the technical article in the case the answer does reside there. Regards, Jay

Re: Wrap/stack a text string label in an AGOL web map

KenBuja — Wed, 02 Feb 2022 17:38:00 GMT

What you'd have to do is split the string and rebuild it with the line breaks

var array = split($feature.yourField, " "); var string; for (var k in array){ string += array[k] + TextFormatting.NewLine } return string;

A more complex code will put line breaks at certain lengths (the variable maxlength)

Re: Wrap/stack a text string label in an AGOL web map

JayHodny — Wed, 02 Feb 2022 17:42:12 GMT

Hi Ken, Many thanks! I was heading down the string split path, but my inexperience at Arcade was getting in the way. Thanks for the code. I will give this a try. Regards, Jay

Re: Wrap/stack a text string label in an AGOL web map

JayHodny — Thu, 03 Feb 2022 16:26:32 GMT

That code worked great in the new map viewer, thank you!

Re: Wrap/stack a text string label in an AGOL web map

SarahHartholt — Thu, 26 May 2022 17:25:04 GMT

Is it possible to create multiline labels in map viewer classic without using the split function?

I've launched the election solution which was created using map viewer classic. I would like to label my precincts by their number and name (i.e. Precinct 01 Cambell) with a line break after the number. My current arcade expression looks something like the following and returns a single line label:

var code = $feature.districtid; if (code == '01'){ return "Precinct 01" + TextFormatting.NewLine + "Cambell" } else if (code == '02'){....

Re: Wrap/stack a text string label in an AGOL web map

KenBuja — Thu, 26 May 2022 18:06:10 GMT

Map Viewer Classic is based on JavaScript 3.x and TextFormatting.NewLine does not work in that version. Adding in a line break only works with the new Map Viewer since it is based on JavaScript 4.x which doesn't have that limitation.

Re: Wrap/stack a text string label in an AGOL web map

Lea_DyrholmHansen — Thu, 22 Sep 2022 08:34:50 GMT

Hi @KenBuja

Do you know why stacking of labels doesn't work i Web AppBuilder eventhough it is set in ArcGIS Pro before publishing a feature service to ArcGIS Protal?

I have a long textfield that I for some features need stacking on.

Re: Wrap/stack a text string label in an AGOL web map

KenBuja — Thu, 22 Sep 2022 16:08:09 GMT

Web AppBuilder is built on JavaScript 3.x, which cannot render line breaks in labels. You would have to use Experience Builder, which is built on JavaScript 4.x, to render the line breaks.

Re: Wrap/stack a text string label in an AGOL web map

Lea_DyrholmHansen — Fri, 23 Sep 2022 08:14:52 GMT

Thanks, I will look forward to using Experience Builder. Our system is not ready for that yet.

Re: Wrap/stack a text string label in an AGOL web map

ZacharyUhlmann1 — Thu, 03 Nov 2022 15:43:41 GMT

Hi Ken - Hopefully you can save me some time on a hopefully simple question. Where do I apply that code? I use Python a lot, not yet Java or JS, but I can read it. Do you have any resources for applying this code to the same situation as the original Q poster - @JayHodny ? I want to split the lines of labels for one Feature using your based on maxLength parameter. I appreciate your help!

Re: Wrap/stack a text string label in an AGOL web map

KenBuja — Thu, 03 Nov 2022 16:19:19 GMT

In the Map Viewer, click the Label icon on the right menu, then click Label. Click on "</>" in the Label field to open the Arcade editor.

Re: Wrap/stack a text string label in an AGOL web map

sajjady — Thu, 14 Mar 2024 08:10:16 GMT

Hi @KenBuja thanks for this expression. Could you please suggest for two or three different field expression in multiline.

Same like this type of expression

Re: Wrap/stack a text string label in an AGOL web map

KenBuja — Thu, 14 Mar 2024 17:13:49 GMT

It would be helpful to start a new discussion and give more information on what you're trying to do.

Re: Wrap/stack a text string label in an AGOL web map

sajjady — Mon, 18 Mar 2024 12:22:23 GMT

Hi @KenBuja Its really work but this expression is for only one field. I have three fields to lable for a polygon. Could you plese share your eperience how i can lable 3 fields with stack/wrap.

Re: Wrap/stack a text string label in an AGOL web map

KenBuja — Mon, 18 Mar 2024 14:36:16 GMT

You can always add more fields to a label string. This example uses template literals.

var output = `${$feature.field1} and ${$feature.field2}`

Re: Wrap/stack a text string label in an AGOL web map

JonathanHallam1 — Sat, 13 Apr 2024 23:01:28 GMT

Used the top code but doens't work when field has a list with Domain

$feature["Camper"]

DomainName($feature, "Camper")

How do I update code?

Re: Wrap/stack a text string label in an AGOL web map

MappyIan — Tue, 30 Apr 2024 12:05:25 GMT

Thanks for these bits of code @KenBuja, but I had a problem with the first example if the feature has a <null> value for the field I was trying to label with. I modified the code to add an if statement so that it only tries to add a new line if there is a value in the field:

The code above also includes a check on the length of each value in the array and only adds a new line if the word is >2 characters in length (e.g. so that single/two letter words are not split on to separate lines).

Just sharing so others don't have to spend ages trying to figure it out if they hit the same problem.

Re: Wrap/stack a text string label in an AGOL web map

GreenInfoNetwork — Wed, 14 Aug 2024 17:42:30 GMT

@KenBuja Is it possible to add left or right justify to your code?