Styling agm-marker labels

[zolastro]

Is there a way to style the labels that appear just on top the agm-marker? In my case, I would like to add a shadow to the text, but this doesn't seem to work. If I add the styling for the whole agm-map, I get the desired result, but some text like addresses and street view is also affected.

I've also tried this approach, but it doesn't work either:

agm-marker { text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff; }

Some suggestions?

Here is part of the actual HTML code that I'm currently using.

<agm-map
    [latitude]="coordinates.latitude"
    [longitude]="coordinates.longitude"
    [zoom]="10">
         <agm-marker
            class="shadow-text"
            *ngFor="let location of pois"
            [markerClickable]="true"
            [latitude]="location.geoLocation.latitude"
            [longitude]="location.geoLocation.longitude"
            [label]="location.title"
     ></agm-marker>
</agm-map>

Thanks!

[karol-depka]

+1

[karol-depka]

Mention the styles property of Google Maps? To be implemented in AGM?

[abyrne85]

Have you figured out how to do this since opening this ticket? I'm having the same issue. Not many styles are supported it seems

[zolastro]

Not yet, if you finally find some way to solve it, let me know please.

[rainergp]

I'm using the new version of the package @agm/core, and I'm able to do something like this:

markers.push({
	latitude: point.latitude,
	longitude: point.longitude,
	url: "./assets/icons/some-icon.svg",
	label: {
		color: '#ffffff',
		fontWeight: 'bold',
		text: "Lorem Ipsum"
	}
});

[shadisafadi]

I'm using *ngFor in the marker tag, and this worked for me: [label]="{color: 'white', text: location.title}"