search

alex3165 / react-mapbox-gl

A React binding of mapbox-gl-js
http://alex3165.github.io/react-mapbox-gl/
MIT License
1.93k stars 536 forks source link

React v18: Map container is being appended to DOM twice #1006

Open jtaccinelli opened 2 years ago

jtaccinelli commented 2 years ago

Likely an issue with React 18 running useEffect hook twice.

See here for the output snippet:

<div class="mapboxgl-map" style="height: 100%; width: 100%">
  <div class="mapboxgl-canary" style="visibility: hidden"></div>
  <div class="mapboxgl-canvas-container mapboxgl-interactive mapboxgl-touch-drag-pan mapboxgl-touch-zoom-rotate"></div>
  <div class="mapboxgl-control-container"></div>
  <div class="mapboxgl-canary" style="visibility: hidden"></div>
  <div class="mapboxgl-canvas-container mapboxgl-interactive mapboxgl-touch-drag-pan mapboxgl-touch-zoom-rotate"></div>
  <div class="mapboxgl-control-container"></div>
</div>