ember-leaflet: Marker Icons don't work with ember 2.4

I just started a new project with ember 2.4 and ember-leaflet and I’m having problems getting the marker icons to work.

I created a new ember 2.4 project with just an example in it and it also doesn’t work. Test Project Ember 2.4 and ember-leaflet

 ember -v
version: 2.4.0
node: 5.5.0
os: linux x64

The md5 hash of the icons are not the same which is also strange and maybe can help you find the problem. 87f6ca46ac356e81dc438589630ae107 bower_components/leaflet/dist/images/marker-icon.png d95f8980883dd995b4a9595825bf8366 dist/assets/images/marker-icon.png

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 16 (7 by maintainers)

Most upvoted comments

@borisrorsvort that won’t work.

In your example, when you do icon=userCustomIcon you’re actually saying that the icon property is a function. The icon property must be an L.icon instance and not a function. userCustomIcon is just a function in your controller, if you take a closer look.

You can solve this by making userCustomIcon the L.icon instance directly:

userCustomIcon: L.icon({
  iconUrl: '...'
  // etc
})

or, if you need a more complex icon, you can just use a computed property:

userCustomIcon: computed(function() {
  let fancyIconUrl = this.get('someService').get('whatever');
  return L.icon({
    iconUrl: fancyIconUrl
    // etc
  });
})

Additionally, you can also subclass MarkerLayerComponent and define your icon there. Then use it like {{#my-custom-marker}}.

miguelcobain on Mar 9, 2016