Marker Labels - from ArcGIS data

[Dan Chadney]

I Have a leaflet map setup displaying data from a ArcGIS. I have managed to get it to customize the data shown in the popups, but can't for the life of me figure out how to show a field outside of the popups... for instance I want to show the unique ID's from ArcGIS for each marker... right now there is just a custom marker set for the entire layer.... I want to show the ID numbers without having to click on the marker...

Here is a link to the map:

http://www.powereng.com/visual/eerd/leaflet/index.html

Here is the data:

http://gis.ultimap.com/arcgis/rest/services/PEPCO_Demo/Church_to_Steel_20150304/MapServer/2

[Jason Sanford]

Dan,

Could you try something like leaflet.label? https://github.com/Leaflet/Leaflet.label

--
You received this message because you are subscribed to the Google Groups "Leaflet Vector Layers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-l...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Dan Chadney]

Hi Jason,

Thanks for that tip. I tried it out but doesn't seem to be working. Here is the code that I am using:

poles.setMap(map1);

    var poleMarker = new L.Icon({

iconUrl: "https://chart.googleapis.com/chart?chst=d_map_pin_letter&chld=1|000000|ffffff",

iconSize: new L.Point(21, 34),

iconAnchor: new L.Point(8, 8),

riseOnHover: true,

popupAnchor: new L.Point(1, -8)

});

             poles = new lvector.AGS({

                    url: "http://gis.ultimap.com/arcgis/rest/services/PEPCO_Demo/Church_to_Steel_20150304/MapServer/2",

                    fields: "*",

                    scaleRange: [3, 200],

                    showAll: true,

singlePopup: true,

esriOptions: false,

symbology: {

type: "single",

vectorOptions: {

icon: poleMarker.bindLabel('{OBJECTID}').addTo(map1);

}

},

                    popupTemplate: '<div class="iw-content"><h3>Pole</h3><table class="condensed-table"><tr><th>ID:</th><td>{OBJECTID}</td></tr></table></div>'

                });

I get these errors...

Uncaught TypeError: undefined is not a function

for this line: icon: poleMarker.bindLabel('{OBJECTID}', {

Uncaught TypeError: Cannot read property 'setMap' of undefined

for this line: poles.setMap(map1);

Not sure if it's just a syntax thing or just not compatible with Leaflet Vector Layers??

To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-layers+unsub...@googlegroups.com.

[Jason Sanford]

Yeah, that {OBJECTID} syntax is something that will only work in popupTemplate. Unfortunately LVL isn't very plugable :(

This is a hack, but there is a "private" _vectors property you can access for poles. You could loop through each item in there and attach a label that way.

poles._vectors.forEach(function (feature) {

  var theMarker = feature.vector;

  var objectId = feature.properties.OBJECTID;

  theMarker.bindLabel(objectId, { noHide: true })

});

There's no way to know (IIRC) when a vector layers features have all loaded, so you may need to delay the above call a bit to ensure that all vectors (poles) have been loaded.

Does that help?

To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-l...@googlegroups.com.

[Dan Chadney]

Hi Jason,

Thanks - this is a very clever hack, and it's not showing any errors, but it's still not working for me. I set it to run on window load and also added a delay but no joy.

        $(window).load(function() {

function showLabel() {  

poles._vectors.forEach(function (feature) {

 var theMarker = feature.vector;

 var objectId = feature.properties.OBJECTID;

 theMarker.bindLabel(objectId, { noHide: true })

});

}

setTimeout(showLabel, 1000)

});

Am I doing something wrong?

To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-layers+unsubscri...@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Jason Sanford]

Hmm, nothing stands out to me. I might try to delay that more than 1 second. You've got a lot of layers there, it could just be taking longer than 1 second. If you can get your half-working code up on a public server I can debug a little easier.

To unsubscribe from this group and stop receiving emails from it, send an email to leaflet-vector-l...@googlegroups.com.

[Dan Chadney]

Okay - tried 25 seconds, still nothing.

Here is a codepen:

 

http://codepen.io/dchadney/pen/yydpyW

[Dan Chadney]

@Jason - Thanks for your help with this. I cannot see any reason why this is not working for me. Anyone else out there have any suggestions?

Thanks,
Dan