search

aviklai / react-leaflet-google-layer

Google layer for React-Leaflet using leaflet.gridlayer.googlemutant, implemented with typescript
MIT License
49 stars 8 forks source link

The shapes do not match the Google Map layer #28

Open fariba1981 opened 2 years ago

fariba1981 commented 2 years ago

function App() { return (

Atlantis Internet Services

; Hello nologo skule

); }

aviklai commented 2 years ago

@fariba1981 Hi,

Can you please add a codesandbox with the issue and explain it?

fariba1981 commented 2 years ago

Hi,

sure, here is the link https://codesandbox.io/s/thirsty-water-2egu8?file=/src/App.js:131-157 I use react-leaflet-google-layer library as well as react-leaflet polygons are fit on the 'open street map', but not on the 'google maps'

aviklai commented 2 years ago

I don't see there the import of react-leaflet-google-layer and the polygons. Can you please check?

tomerpaz commented 2 years ago

Hi, I had similar issue. The fix was ro wrap the MapContainer <div style={{ style: 'flex', flex: 1}}> <MapContainer ...>

aviklai commented 2 years ago

@tomerpaz Hi,

Can you please add a codesandbox?

tomerpaz commented 2 years ago

adding the < div > around the MapContainer solved rthe issue. Othewise the map was offset. and polygon not in the right place

https://codesandbox.io/s/competent-poitras-lgvd8x?file=/src/App.js

before the wrapper div it worked fine with OSM and ESRI but not google. Now it works fine with all tiles.

google odm esri s

aviklai commented 2 years ago

@tomerpaz Hi,

It looks like something similar to this issue: https://github.com/aviklai/react-leaflet-google-layer/issues/12 But it's already fixed in here: https://gitlab.com/IvanSanchez/Leaflet.GridLayer.GoogleMutant/-/commit/8f738c12f0a4c529140607df0e1c01b281cbe075

I tried to reproduce with the example from the above issue and it looks o.k without specifying a div around the map container: https://codesandbox.io/s/dry-morning-mr63fe

Another example: https://codesandbox.io/s/focused-cerf-ejwlsn

I use here the latest version of this library which uses the latest version of Leaflet.GridLayer.GoogleMutant. Can you please try to reproduce a full example of the problem in codesandbox?