topic Re: Label Class Issues in ArcGIS JavaScript Maps SDK Questions

Label Class Issues

jaykapalczynski — Sun, 12 Dec 2021 06:35:49 GMT

I am using API 3.22

Trying this...It works but HaloColor, HaloSize, Vertical Alignment and Horizontal Alignment dont seem to be working..

Thoughts?

var labelClass = new LabelClass({  
   labelExpressionInfo: {"value": "{STREET_NAME}"},  
   symbol: {  
    "type": "esriTS",  
    "color": [225,225,0],  
    "font": {  
      "family": "Arial",
      "haloColor": "#FF0000",
      "haloSize": "3.25px",                 
      "size": "8px",
      "verticalAlignment": "middle",  
      "horizontalAlignment": "center"            
    }  
   }  
});      ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Label Class Issues

RobertScheitlin__GISP — Sun, 12 Dec 2021 06:35:52 GMT

Jay,

That is because those properties are NOT properties of font where you have them. They are properties of TextSymbol.

var labelClass = new LabelClass({
   labelExpressionInfo: {"value": "{STREET_NAME}"},
   symbol: {
    "type": "esriTS",
    "color": [225,225,0],
    "haloColor": "#FF0000",
    "haloSize": "3.25px",
    "verticalAlignment": "middle",
    "horizontalAlignment": "center",
    "font": {
      "family": "Arial",
      "size": "8px"
    }  
   }  
});      ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Label Class Issues

jaykapalczynski — Fri, 01 Dec 2017 21:43:19 GMT

Still no Halo (should be Red) or alignment (should be middle on the vertical access)

Made the halo 20 and nothing changed.

Re: Label Class Issues

jaykapalczynski — Fri, 01 Dec 2017 21:57:13 GMT

Looking here...LabelClass | API Reference | ArcGIS API for JavaScript 3.22

But was somewhere else where It had info on Vertical and Horizontal properties. The above location dosent mention these...

Where is a list of all the properties I can set? Info seems to scattered all over the API website

Re: Label Class Issues

RobertScheitlin__GISP — Fri, 01 Dec 2017 22:00:29 GMT

Jay,

It is the TextSymbol that has those properties:

TextSymbol | API Reference | ArcGIS API for JavaScript 3.22

Re: Label Class Issues

jaykapalczynski — Fri, 01 Dec 2017 22:07:19 GMT

why doesnt the Halo work then? Confused...you see my image above?

Re: Label Class Issues

RobertScheitlin__GISP — Fri, 01 Dec 2017 22:29:21 GMT

NOTE: Known limitations when working with the text symbol halo:

IE 9 and below not supported.
Sub-pixel halo (i.e.

Re: Label Class Issues

RobertScheitlin__GISP — Sun, 12 Dec 2021 06:35:54 GMT

Jay,

This works fine for me:

            var lc = new LabelClass({
              labelExpressionInfo: {"value": "{STREET_NAME}"},
              symbol: {
                "type": "esriTS",
                "color": [225,225,0],
                "haloColor": [255,0,0],
                "haloSize": "3",
                "verticalAlignment": "middle",
                "horizontalAlignment": "center",
                "font": {
                  "family": "Arial",
                  "size": "8px"
                }
              }
            });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Label Class Issues

jaykapalczynski — Sun, 12 Dec 2021 06:35:57 GMT

Thanks guys for your input...just a note I am testing on Chrome

I see where I was incorrect on the Halo Size...I was using "3px" not "3".

Was confused here because the Size uses "px" to denote the pixel size...thought the halo size was the same. Very stupid if you ask me. If talking size stick to one or the other, px or no px.

LAST QUESTION: I added weight property and again nothing happened...this is a property of FONT as I see the documentation reading.

var labelClass = new LabelClass({
   labelExpressionInfo: {"value": "{STREET_NAME}"},
   symbol: {
    "type": "esriTS",
    "color": [0,0,0],
    "haloColor": [255,255,255],
    "haloSize": "1",
    "verticalAlignment": "middle",
    "horizontalAlignment": "center",
    "font": {
      "family": "Arial",
      "size": "10px",
      "weight": "WEIGHT_BOLDER"
    }  
   }  
});  
     ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Label Class Issues

RobertScheitlin__GISP — Sun, 12 Dec 2021 06:35:59 GMT

Jay,

The whole size vs halo size thing is just paying attention to the doc. The Font Class has size property and it expects <Number | String> size, where TextSymbol haloSize expects <Number> haloSize. Ya it propably would be easier is they stuck to one way or the other.

Because you are attempting to do all the settings of your labelClass in JSON you need to use the REST API's expected values:

http://help.arcgis.com/en/arcgisserver/10.0/apis/rest/symbol.html#ts

So wieght property in JSON would be "bolder":

            var lc = new LabelClass({
              labelExpressionInfo: {"value": "{TripID}"},
              symbol: {
                "type": "esriTS",
                "color": [225,225,0],
                "haloColor": [225,0,0],
                "haloSize": 3.25,
                "verticalAlignment": "middle",
                "horizontalAlignment": "center",
                "font": {
                  "family": "Arial",
                  "size": "10px",
                  "weight": "bolder"
                }
              }
            });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Label Class Issues

jaykapalczynski — Mon, 04 Dec 2017 14:34:59 GMT

Thanks for all your help guys...very appreciated. Dont code much and always hard getting on the bike again, little wobbly at first...