leaflet-rastercoords icon indicating copy to clipboard operation
leaflet-rastercoords copied to clipboard

React-leaflet bug with leaflet-rastercoords setMaxboundaries

Open atipezda opened this issue 3 years ago • 0 comments

What happend?

When using leaflet-rastercoords plugin with react and react-leaflet we have an issue that overrides maxBounds of map.

Steps to reproduce

Create RasterCoords as state

const [raster] = useState<Raster>(new L.RasterCoords(map, imageDimensions))

Set map max Bounds with value that inst same as value for raster layer bounds f.e use padding

map.setMaxBounds(raster.getMaxBounds().pad(1))

Change state or re-render the component and whole bounds are set to max bounds of raster layer (raster-coords overrides our settings on re-render)

Raster-coords doesn't need to set max-bounds

We can just use bounds property of tile layer to limit layer dimensions

<TileLayer
   bounds={raster.getMaxBounds()}
   ...
 />

What is causing this?

That lines of code in leaflet-rastercoords: https://github.com/commenthol/leaflet-rastercoords/blob/564731dc593e24a2f1f173fc736e46fe8f16a5b1/rastercoords.js#L38-L40

Possible fix

Just add new param that can disable setting maxBounds with default value (backward-compability)

L.RasterCoords = function (map, imgsize, tilesize, setmaxbounds = true) {

and than on line with if:

    if (setmaxbounds && this.width && this.height) {
      this.setMaxBounds()
    }

atipezda avatar Apr 29 '22 14:04 atipezda