2

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.

CodeHahn
  • 279
  • 6
  • 17

0 Answers0