search

mariusandra / pigeon-maps

ReactJS Maps without external dependencies
https://pigeon-maps.js.org/
MIT License
3.43k stars 142 forks source link

Issues with NextJS and SSR. #168

Open bnbon opened 1 year ago

bnbon commented 1 year ago

I am using the latest version of pigeon-maps with the latest version of nextjs on a page that's rendered server side, and I get 

Warning: Prop `style` did not match. Server: "position:absolute;transform:translate(-15px, 117px);pointer-events:none;cursor:pointer" Client: "position:absolute;transform:translate(-15px, 117px);filter:;pointer-events:none;cursor:pointer"

Does anyone else get this issue, and ideally does anyone have a fix? I seem to lose the overlay and the map tiles only appear if I change the zoom level client side with the mousewheel/zoommarker.

Neophen commented 1 year ago

To not waste time the change is an additional property in client-rendered style:

filter:

A temporary fix is to add:

  style={{ filter: "none" }}

on <Marker /> Components

I've done a PR to fix this Link to pr

bnbon commented 1 year ago

@Neophen Good spot :)

Mood93 commented 1 year ago

Hello! Great project! I am having this issue on NextJS 13.4.7 (pages directory) using pigeon-maps 0.21.3. I have tried the fix above to no avail, any ideas? Thanks!