I'm trying to use font awesome icons with google map api on-top of Angular2 application, for the map I'm using angular2-google-maps by Sebastian Müller https://angular-maps.com/. I want to use a custom map marker using some icon library (for example fontAwesome). The only way I managed to do it is by downloading the icon as svg and then using the [iconUrl] with the icon location in the project, like so:
<sebm-google-map class="map" [latitude]="center.lat" [longitude]="center.lng" [zoom]="zoom" [mapDraggable]="true">
<sebm-google-map-marker *ngFor="let event of events" [latitude]="event.lat" [longitude]="event.lng"
[iconUrl]="'/images/i_48px.svg'">
</sebm-google-map-marker>
This create an icon on the map but seems wrong, since I don't have any easy control over the styling and it force me to download each icon that I want to use.
Is there a way to style sebm-google-map-markers using a directive for example?
I also tries:
<sebm-google-map class="map" [latitude]="center.lat" [longitude]="center.lng" [zoom]="zoom" [mapDraggable]="true">
<sebm-google-map-marker *ngFor="let event of events" [latitude]="event.lat" [longitude]="event.lng"
[iconUrl]="'/images/i_48px.svg'" [style.color]="'red'">
</sebm-google-map-marker>
with no success.