LabelLayer Has 'Undefined' label for FeatureLayer with 0 Index

chuckfrank · ‎11-18-2015

While attempting to label a feature layer that has the 0 index of a dynamic map service, I was unable to get the labels to properly display. The displayed label was always "Undefined", but the feature layers at index 1,2, etc. worked just fine for the other layers within the map service. As a work-around, I added a dummy layer on top to take the zero index and changed my javascript side accordingly. The map service shows population centers that are filtered by different definition queries but no display scales are set on the mxd side. I did that in the js side. So its the same feature class, just restricted by different fields a few times. The display fields is the same for all of them. There was no difference between layer 0 and layer 1 in the service except for the definition query in the mxd, yet labels in the 0 layer were undefined and the labels in the 1 layer worked fine. Maybe this comment will potentially help somebody that runs into the same issue.

RobertScheitlin__GISP · ‎11-18-2015

Chuck,

Can you share the code that you are having an issue with?

chuckfrank · ‎11-18-2015

No problem, the code is below:

I sanitized the "domain" below but could provide that privately.

// first layer does not work

var cities0surl = "http://domain/arcgis/rest/services/Mapping/CitiesWebMap/MapServer/0";

var cities1surl = "http://domain/arcgis/rest/services/Mapping/CitiesWebMap/MapServer/1";

// This was displaying as 'undefined' - commented out, copied, pasted and changed 0 to 1 (below)

//var cities0FeatureLayer = new FeatureLayer(cities0surl, {

// id: "cities0FeatureLayer",

// maxScale: 1000000,

// minScale: 3000000,

// outfields: ["AREANAME"],

// visible: false

//});

// this layer works with the same features that had been in layer 0, I modified the map service by adding // an artificial layer on top - and that now shows the 'undefined' label but I don't use it

var cities1FeatureLayer = new FeatureLayer(cities1surl, {

id: "cities1FeatureLayer",

maxScale: 1000000,

minScale: 3000000,

outFields: ["AREANAME"],

visible: false

});

// adding to map

//map.addLayer(cities0FeatureLayer);

map.addLayer(cities1FeatureLayer);

// LABELS

//-----------------------------------------------------------------------------------------------------------------//

// create a renderer for the states layer to override default symbology

var labelColor = new Color("#000000");

// create a text symbol to define the style of labels

var statesLabel = new TextSymbol().setColor(labelColor);

statesLabel.setAlign(TextSymbol.ALIGN_START);

statesLabel.font.setSize("0.8em");

statesLabel.font.setFamily("tahoma");

statesLabel.font.setWeight("BOLD");

var statesLabelRenderer = new SimpleRenderer(statesLabel);

var labels = new LabelLayer({ id: "labels" });

// using the field named "AREANAME"

//labels.addFeatureLayer(cities0FeatureLayer, statesLabelRenderer, "{AREANAME}");

labels.addFeatureLayer(cities1FeatureLayer, statesLabelRenderer, "{AREANAME}");

// add the label layer to the map

map.addLayer(labels);

//-----------------------------------------------------------------------------------------------------------------//

RobertScheitlin__GISP · ‎11-18-2015

Chuck,

Strange, I had no problem at all using layer 0 of my map service.

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <title></title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
    <style>
      html, body, #map {
        height: 100%; width: 100%; margin: 0; padding: 0;
      }
    </style>

    <script src="http://js.arcgis.com/3.14/"></script>
    <script>
      var map;

      require([
        "esri/map",
        "esri/geometry/Extent",
        "esri/layers/FeatureLayer",

        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/symbols/TextSymbol",
        "esri/renderers/SimpleRenderer",

        "esri/layers/LabelLayer",

        "esri/Color",
        "dojo/domReady!"
      ], function(
        Map, Extent, FeatureLayer,
        SimpleLineSymbol, SimpleFillSymbol, TextSymbol, SimpleRenderer,
        LabelLayer,
        Color
      ) {
        // load the map centered on the United States
        var bbox = new Extent({"xmin": -1940058, "ymin": -814715, "xmax": 1683105, "ymax": 1446096, "spatialReference": {"wkid": 102003}});
        map = new Map("map", {
          basemap: "gray",
          extent: bbox,
          logo: false,
          slider: false
        });

        var labelField = "SCHOOLNAME";

        var schoolsColor = new Color("#000000");
        var schoolsUrl = "http://my arcgis server/arcgis/rest/services/County_Info/MapServer/0";
        var schools = new FeatureLayer(schoolsUrl, {
          id: "Schools",
          outFields: ["*"],
          definitionExpression: "DISTRICT = 'CALHOUN COUNTY'"
        });
        map.addLayer(schools);

        // create a text symbol to define the style of labels
        var schoolsLabel = new TextSymbol().setColor(schoolsColor);
        schoolsLabel.setAlign(TextSymbol.ALIGN_START);
        schoolsLabel.font.setSize("0.8em");
        schoolsLabel.font.setFamily("tahoma");
        schoolsLabel.font.setWeight("BOLD");
        var schoolsLabelRenderer = new SimpleRenderer(schoolsLabel);
        var labels = new LabelLayer({ id: "labels" });
        labels.addFeatureLayer(schools, schoolsLabelRenderer, "{" + labelField + "}");
        // add the label layer to the map
        map.addLayer(labels);
      });
    </script>
  </head>
  <body>
    <div id="map"></div>
  </body>
</html>