js-markerwithlabel
js-markerwithlabel copied to clipboard
The labelStyle parameter is not being applied
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.
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.
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.