Transform / Translate make the popup (text) blur

[T-Nagui]

Hi,
I like the plugin for map but i have few issue and the main one is with this line

google-maps-react-markers/src/map/overlay.js

Line 35 in d258557

this.container.style.transform = `translate(${point.x}px, ${point.y}px)`

The Transform and Translate make the text go blur and the best way is to use top and right instead of it

[giorgiabosello]

How come text become blur because of the transform?
This line is suggested directly from Google.

[T-Nagui]

hi
in overlay the transform translate the pin and I have a custom pin and custom hover card
the transfrom translate get the pin and card to the correct position and the blur bug is known bug that make the text get blur after
https://css-tricks.com/forums/topic/blurry-text-in-chrome-and-opera-with-css-transform/

[giorgiabosello]

hi
in overlay the transform translate the pin and I have a custom pin and custom hover card
the transfrom translate get the pin and card to the correct position and the blur bug is known bug that make the text get blur after
https://css-tricks.com/forums/topic/blurry-text-in-chrome-and-opera-with-css-transform/

I'm going to give it a check next week. :)

[T-Nagui]

ok Thinks Maybe i can make a pull request if i have a fixe if you don't mind

[giorgiabosello]

@T-Nagui yeah, sure.

[white-wolf97]

Hi Giorgia, I was thinking about contributing to the google-maps-react repository, but since that seems to not be mantained anymore, can I contribute in this project?

[giorgiabosello]

@white-wolf97 any help is appreciated. :)

[giorgiabosello]

@T-Nagui I'm not able to reproduce your issue. If you click on a marker here, you'll see text isn't blurred.
Please, provide a codesandbox example.