The labelStyle parameter is not being applied

wlius-support3 commented 1 year ago

It appears that the labelStyle parameter is not being applied. According to the documentation, the labelStyle parameter is supposed to allow you to specify custom styles for the label. However, when I try to use this parameter, it does not seem to have any effect on the appearance of the label. I have tried passing various values for the labelStyle parameter, but none of them seem to make a difference. The label text always appears with the default style, regardless of what I specify for labelStyle. I believe this is a bug in the package, as the labelStyle parameter is documented as a valid option but does not appear to be working correctly. It would be great if this could be fixed so that users can take advantage of the full range of customization options available.

Steps to reproduce

Use the googlemaps/js-markerwithlabel package to add a marker to a Google Map.
Specify the labelStyle parameter with custom styles for the label.
Observe that the label appears with the default style, ignoring the styles specified in labelStyle.

Code example

import { MarkerWithLabel } from '@googlemaps/markerwithlabel';

new MarkerWithLabel({
    position: new google.maps.LatLng(49.475, -123.84),
    clickable: true,
    draggable: true,
    map: map,
    labelContent: "foo", // can also be HTMLElement
    labelAnchor: new google.maps.Point(-21, 3),
    labelClass: "labels", // the CSS class for the label
    labelStyle: { opacity: 1.0, color: "red" }, // <- this seems to be ignored
})

Expected behavior:

The label should appear with the styles specified in the labelStyle parameter.

Actual behavior:

The label appears with the default style, ignoring the styles specified in labelStyle.

Affected version:

The issue appears to be present in the latest version (and seemingly all previous versions) of the package as of this writing (v2.0.21). I actually cannot find any reference in any of the code to labelStyle in the git history.

wangela commented 1 year ago

If you would like to upvote the priority of this issue, please comment below or react with :+1: so we can see what is popular when we triage.

@wlius-support3 Thank you for opening this issue. 🙏 Please check out these other resources that might help you get to a resolution in the meantime:

Check the issue tracker - bugs and feature requests for Google Maps Platform APIs and SDKs
Open a support case - Get 1:1 support in Cloud Console.
Discord - chat with other developers
StackOverflow - use the google-maps tag

This is an automated message, feel free to ignore.

dasdawidt commented 4 months ago

I worked around this by setting labelContent to a HTML string like so:

new MarkerWithLabel({
    labelContent: `<strong style="color: red">${text}</strong>`
})

But would greatly apprechiate if it would be fixed, since background and other styles do not get applied properly in this workaround.

googlemaps / js-markerwithlabel