diff --git a/svgmap/src/components/map/Map.tsx b/svgmap/src/components/map/Map.tsx index a8437dc..e22bac8 100644 --- a/svgmap/src/components/map/Map.tsx +++ b/svgmap/src/components/map/Map.tsx @@ -32,13 +32,6 @@ const Map: react.FC = (props: MapProperties) => { const [shift, setShift] = useState({ x: -boardSize / 2, y: -boardSize / 2 }); const [zoom, setZoom] = useState(1); - const [tiledLayerKey, setTiledLayerKey] = useState({ - provider: 'osm', - zoomLevel: 16, - x: 33488, - y: 23939, - }); - const addShift = (deltaShift: { x: number; y: number }) => { setShift({ x: shift.x + deltaShift.x, y: shift.y + deltaShift.y }); }; @@ -102,9 +95,7 @@ const Map: react.FC = (props: MapProperties) => { shift={shift} zoom={zoom} tileSize={256} - key='tiled-layers' numberOfZoomLevels={5} - tiledLayerKeyState={[tiledLayerKey, setTiledLayerKey]} /> , diff --git a/svgmap/src/components/map/TiledLayersStack.tsx b/svgmap/src/components/map/TiledLayersStack.tsx index 4132ced..a689cfd 100644 --- a/svgmap/src/components/map/TiledLayersStack.tsx +++ b/svgmap/src/components/map/TiledLayersStack.tsx @@ -1,6 +1,6 @@ -import react from 'react'; +import react, { useState } from 'react'; import TiledLayer from './TiledLayer'; -import { TileKey, tileKeyToString } from './Map'; +import { tileKeyToString } from './Map'; interface Point { x: number; @@ -14,7 +14,6 @@ interface TiledLayersStackProperties { zoom: number; tileSize: number; numberOfZoomLevels?: number; - tiledLayerKeyState: [TileKey, (tiledLayerKey: TileKey) => void]; } const TiledLayersStack: react.FC = ( @@ -22,7 +21,12 @@ const TiledLayersStack: react.FC = ( ) => { console.log(`Rendering TiledLayersStack`); - const [tiledLayerKey, setTiledLayerKey] = props.tiledLayerKeyState; + const [tiledLayerKey, setTiledLayerKey] = useState({ + provider: 'osm', + zoomLevel: 16, + x: 33488, + y: 23939, + }); const numberOfZoomLevels = props.numberOfZoomLevels === undefined