Assigning one icon per marker

[dougajmcdonald]

Hi @miguelcobain,

I have a (hopefully) easy question regarding markers and I'm forced to use an older version (0.6) for this project.

I have two markers, which I've bound to the contentBinding in a MarkerCollectionLayer like this:

export default EmberLeaflet.MarkerCollectionLayer.extend({
    itemLayerClass: MarkerLayer,
    contentBinding: "controller.markers"
});

I have a maker layer, which implements my drag functionality and at the bottom of that I have an options object to set the marker style:

options: {
    icon: L.divIcon({
        className: 'site-marker',
        iconSize: [40, 40],
        iconAnchor: [20, 20]
    })
}

I have a need to apply a different icon to each of the two markers (a colour variation on the overall marker styles) but I'm not sure how to access the individual marker instances to change the icon.

My 'markers' property on the controller is actually a computed, inside of which I've tried to set the icon property which looks like this:

markers: Ember.computed('markerData.@each.latitude', 'markerData.@each.longitude', function() {
     // map the ember marker class to a POJO to trigger the computed to re-calc.
     // leaflet will call .location which is not the same as .get('location')  
     return this.get('markerData').map((x) => {
         return { 
             location: x.get('location'),
             name: x.get('name'),
             icon: this.getIcon(x.get('name')) 
         };
    })    
})

My 'getIcon' function returns a L.divIcon() instance with my iconUrl etc set as I want them.

The .icon property I set in the computed doesn't seem to be assessed how I'm expecting it to be. Could you let me know what I'm doing wrong?