angular-leaflet-directive
angular-leaflet-directive copied to clipboard
Marker icon base64 string and real marker-icon.PNG conflict
I have some strange issue with default marker image.
My markers are not rendered on map with default marker icon. The source of icon image tag looks like:
http://localhost:60000/js/grunt/dist/images/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAGmklEQVRYw7VXeUyTZxjvNnfELFuyIzOaberm..........
My queion was why base 64 string needs physical path, after small investigation I found that there is some ambiguous behavior in leaflet that combines path with base 64 string(see attached PS)
Am I doing something wrong or there is real problem with markers default images in current version?

It can be seen here that the source code tries to modify the image for the default icon in leaflet in a way different from the one recommended by leaflet docs here.
Nevertheless, a solution is to explicitly add the default icon's image as a custom icon when you define the markers for the directive. (Until it is fixed in the directive)
var base64icon = "data:image/png;base64,iVBO...ggg=="; var icondata = { iconUrl: base64icon, iconAnchor: [19, 19], };
` this.scope.markers = {
myMarker: {
lat: locationLat,
lng: locationLon,
draggable: false,
icon: icondata
}
};`