Open davidjgonzalez opened 1 year ago
Having the same issues. In my case I am moving the offset of icons on a polyline but the icons are not moved, instead new ones are created on the new offset, with the old ones still there (but now appearing below the polyline)
For me this only appears locally when using react strict mode (causing the components to always render twice). With this in mind I am guessing that this is some DOM cleanup issue. When the map component is unmounted the DOM is not properly cleaned so we get some kind of map duplicate
It also only happens the first time i move the offset. If i move the offset again the second icon will be moved properly (but the first icon will still remain)
@MarcusOhman91 Checkout the solution here: https://stackoverflow.com/questions/76149553/next-js-react-18-google-maps-js-api-not-clearing-prior-map-state/76150188#76150188
This is how i ended up fixing/working around this.
Issue template
You can donate or became a sponsor https://opencollective.com/react-google-maps-api#category-CONTRIBUTE
If you want to ask question, please ask it in Github Discussions, Spectrum.chat or Slack channel
Please do not post unformatted code into issues, and please do not ask questions. Only real issues, PR's or feature requests are allowed. Minimal reproduction in codesandbox.io is required.
Please provide an explanation of the issue
Your Environment
os: mac
node --version: 16.8.1
react version: 18.2.0 : webpack version
@babel version
@react-google-maps/api version: 2.18.1
How does it behave?
I can add elements to a GoogleMap (Markers or Directions) but when i try to remove a marker/direction origin/waypoint/destination, ir change the order, all the map artifacts (markers, route polylines ) all continue to show up on on the Google map. It's like I can add elements to the Map, but I cannot remove elements that have been previously drawn. Oddly, i can add elements to the map, and they seem to always work - its changing things already drawn to the map that seems to be the problem. Refreshing the webpage (forcing a "cold reload") of the map, everything renders as expected.
It seems to be same issue reported at: https://stackoverflow.com/questions/74918204/cannot-clear-route-from-directionrenderer-reactjs-with-react-google-maps-api
How should it behave correctly?
Changing my markers or directions state should result in the GoogleMap's visuals reflecting the react state.
Basic implementation of incorrect behavior in codesandbox.com