diff --git a/svgmap/src/components/map/TiledLayersConductor.tsx b/svgmap/src/components/map/TiledLayersConductor.tsx index 5c0a443..01fc179 100644 --- a/svgmap/src/components/map/TiledLayersConductor.tsx +++ b/svgmap/src/components/map/TiledLayersConductor.tsx @@ -31,37 +31,40 @@ const TiledLayerConductor: react.FC = ( : props.numberOfZoomLevels; const layers = []; - const zoomLevel = Math.min( + const ActiveZoomLevel = Math.min( Math.max(Math.round(Math.log2(props.zoom)), 0), numberOfZoomLevels - 1 ); - const getTiledLayer = (i: number, isActive: boolean) => { + const getTiledLayer = (zoomLevel: number, isActive: boolean) => { return ( ); }; // First (ie last) dispay layers with less details (ascending order) - for (let i = 0; i < zoomLevel; i++) { + for (let i = 0; i < ActiveZoomLevel; i++) { layers.push(getTiledLayer(i, false)); } // then dispay layers with more details (descending order) - for (let i = numberOfZoomLevels - 1; i > zoomLevel; i--) { + for (let i = numberOfZoomLevels - 1; i > ActiveZoomLevel; i--) { layers.push(getTiledLayer(i, false)); } // And then, of course, the active one - layers.push(getTiledLayer(zoomLevel, true)); + layers.push(getTiledLayer(ActiveZoomLevel, true)); return <>{layers}; };