topic Javascript label graphic points in ArcGIS JavaScript Maps SDK Questions

Javascript label graphic points

deleted-user-yA_w_FC9FKe5 — Mon, 29 Sep 2014 14:32:21 GMT

I have successfully been able to query my results and put them in a table and show them as points on my map thanks to a lot of help from these forums.

Now what I would like to do is create another graphics layer that just has labeling for these points but I am struggling with this. I've searched endlessly for a way to do this. I've looked through the samples I've found something called a labellayer but I don't know how to apply that. I would think I would be able to use something like what I did for the graphics below but instead of a symbol use text. I created a StoresResultsLayer_Labels as you can see below. I'm sure this is simple but it is not for me for some reason. Any help is greatly appreciated.

//My layers loaded at the start of the application but blank

StoresResultsLayer = new GraphicsLayer();
StoresResultsLayer.id = 'StoresResults';
map.addLayer(StoresResultsLayer,0);

StoresResultsLayer_Labels = new GraphicsLayer();
StoresResultsLayer_Labels.id = 'StoresResults_Labels';
map.addLayer(StoresResultsLayer_Labels,0);

//Some of my code from my function

var symbol = new esri.symbol.SimpleMarkerSymbol({

"color": [255,255,0,255],

"size": 11,

"xoffset": 1,

"yoffset": -2,

"type": "esriSMS",

"style": "esriSMSCircle",

"outline": {

"color": [0,0,0,255],

"width": 3,

"type": "esriSLS",

"style": "esriSLSSolid" }});

   var dataForGrid = [];
var temp = "";
    //remove all graphics on the maps graphics layer
    StoresResultsLayer.clear();
     //Performance enhancer - assign featureSet array to a single variable.
     var resultFeatures = featureSet.features;
     //Loop through each feature returned

     for (var i=0, il=resultFeatures.length; i<il; i++) {
     //Get the current feature from the featureSet.
     //Feature is a graphic
     var graphic = resultFeatures;
     resultFeatures.setSymbol(symbol);


StoresResultsLayer.add(resultFeatures);
StoresResultsLayer.show();

Re: Javascript label graphic points

Anonymous User — Mon, 29 Sep 2014 15:46:44 GMT

Hi Michael -

It should in fact be pretty simple for you since you already have dealt with adding the graphics. You need to do 3 things: create a label renderer, create a label layer, and then add the features to the label layer. A lot of the information is here: labellayer-amd | API Reference | ArcGIS API for JavaScript.

// Make sure you include all of the modules here in your JavaScript 'require' function (e.g. 'esri/layers/LabelLayer', 
// 'esri/symbols/TextSymbols' etc)

// Create label renderer
var labelParams = new TextSymbol({
        "type" : "esriTS",
        "color" : [0, 0, 153, 255],
        "font" : {
            "size" : 12,
            "style" : "normal",
            "weight" : "normal"
        }
    });
var labelRenderer = new SimpleRenderer(labelParams);

// Create the empty label layer
graphicsLabelLayer = new LabelLayer({
        id : "graphicsLabels"
 });

// Associate the label layer with the graphics you want to label
// Substitute in the field name you want to use to label your features
graphicsLabelLayer.addFeatureLayer(StoresResultsLayer , labelRenderer, '{field_name}');

Re: Javascript label graphic points

deleted-user-yA_w_FC9FKe5 — Tue, 30 Sep 2014 11:19:48 GMT

Hi Sarah and thanks for the quick reply. I've tried messing around with your code and this example:

Label Layer | ArcGIS API for JavaScript but for the life of me I can't get it working. I wonder if it is because I am using a graphics layer and not a feature layer?

Basically I am filtering out a layer and then presenting the results as graphics. I would then like to have labels for each of the graphics so they know the points name. (StoreName) in this case.

Re: Javascript label graphic points

deleted-user-yA_w_FC9FKe5 — Tue, 30 Sep 2014 12:17:51 GMT

This lead me in the right direction. I just created another feature layer with opacity set to 00 and then used that to label. Not the best of solutions but hey it works.

Re: Javascript label graphic points

Anonymous User — Tue, 30 Sep 2014 16:07:17 GMT

You know, in looking at the documentation it does seem to require a feature layer! I hadn't noticed that before, and I didn't test it, but I think you made the right call there.