Adding circles on the map dynamically

[xkd]

Hello! IIUC, the only way to add circles is using onGoogleApiLoaded callback, which is being called only once. I've tried adding a circle as div, but its radius wont be bound to map scale. Is there another way to add a circle from the API?

Thanks.

[istarkov]

Hi, there is undocumented function exists in this library to calculate size of your marker div
meters2ScreenPixels

import { meters2ScreenPixels } from 'google-map-react/utils';
const { w, h } = meters2ScreenPixels(sizeInMeters, { lat, lng } /* marker coords*/, zoom /* map zoom*/);

it returns horizontal - w and vertical - h sizes for given meters, point and zoom.
Having mercator map projection and that our world is not plane for some places w and h will be different, for most places almost the same.

[istarkov]

Now documented https://github.com/istarkov/google-map-react/blob/master/DOC.md#helper-utilities
¯\_(ツ)_/¯

[xkd]

It works for me, thanks.

[anderswag]

I seem to be getting NaN for the "w" and "h" values, is this function still working? Thanks

[istarkov]

Must work, check your args

[itsmichaeldiego]

It seems that the solution has been provided. Let me know if otherwise.

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.