react-google-maps icon indicating copy to clipboard operation
react-google-maps copied to clipboard

[Bug]Cannot remove a WebglOverlay

Open AdamZajler opened this issue 9 months ago • 0 comments

Description

When I'm changing places list that is passed down to the Map as a array for map of MapMarker i'm getting error

Cannot remove a WebglOverlay that has not been set to a map

image

Code that I'm using is the same as it was in: https://github.com/visgl/react-google-maps/discussions/325#discussion-6563222. Im just changing places, so it is triggering re-render of Map.

I'm also doing some calculations to center the map when places are changed or map is loaded:

const handleSetBounds = (): void => {
  if (!map) return;

  map.fitBounds(getMapBounds(window.google.maps, places));

  if (places.length < 2 && places.length > 0) {
    map.fitBounds(getMapBounds(window.google.maps, places));
    map.setZoom(14);
  } else if (places.length === 0) {
    map.setZoom(0);
    map.fitBounds(polandBounds);
  }
};

useEffect(() => {
  if (!map) return;
  handleSetBounds();

  // eslint-disable-next-line react-hooks/exhaustive-deps
}, [map, places]);

Steps to Reproduce

Change variable that is used to map thought map markers

Environment

  • Library version: "@vis.gl/react-google-maps": "^0.10.0",
  • Google maps version: weekly
  • Browser and Version: 124.0.6367.118
  • OS: Linux

Logs

Cannot remove a WebglOverlay that has not been set to a map 
    at eval (webpack-internal:///./node_modules/@vis.gl/react-google-maps/dist/index.modern.mjs:1081:5)
    at GoogleMapsMarker (webpack-internal:///./ui/google-maps/GoogleMapsMarker.tsx:23:11)
    at div
    at Map (webpack-internal:///./node_modules/@vis.gl/react-google-maps/dist/index.modern.mjs:783:5)
    at div
    at eval (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-43c6fea0.browser.esm.js:60:66)
    at Box (webpack-internal:///./node_modules/@mui/system/esm/createBox.js:37:72)
    at eval (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-43c6fea0.browser.esm.js:60:66)
overrideMethod @ console.js:273
a @ js?key=XXX&solution_channel=GMP_VISGL_react&loading=async&callback=__googleMapsCallback__:348
_.kn.map_changed @ js?key=XXX&solution_channel=GMP_VISGL_react&loading=async&callback=__googleMapsCallback__:348
Uk @ js?key=XXX&solution_channel=GMP_VISGL_react&loading=async&callback=__googleMapsCallback__:155
_.Sk.set @ js?key=XXX&solution_channel=GMP_VISGL_react&loading=async&callback=__googleMapsCallback__:274
(anonymous) @ js?key=XXX&solution_channel=GMP_VISGL_react&loading=async&callback=__googleMapsCallback__:163
dispose @ marker.js:103
KMa @ marker.js:60
dispose @ marker.js:129
setMap @ marker.js:122
set map @ marker.js:121
eval @ index.modern.mjs:1012
safelyCallDestroy @ react-dom.development.js:22932
commitHookEffectListUnmount @ react-dom.development.js:23100
commitPassiveUnmountInsideDeletedTreeOnFiber @ react-dom.development.js:25098
commitPassiveUnmountEffectsInsideOfDeletedTree_begin @ react-dom.development.js:25048
commitPassiveUnmountEffects_begin @ react-dom.development.js:24956
commitPassiveUnmountEffects @ react-dom.development.js:24941
flushPassiveEffectsImpl @ react-dom.development.js:27038
flushPassiveEffects @ react-dom.development.js:26984
commitRootImpl @ react-dom.development.js:26935
commitRoot @ react-dom.development.js:26682
performSyncWorkOnRoot @ react-dom.development.js:26117
flushSyncCallbacks @ react-dom.development.js:12042
eval @ react-dom.development.js:25651
Show 1 more frame
Show less

AdamZajler avatar May 10 '24 06:05 AdamZajler