diff --git a/src/components/map/CurrentLocation.tsx b/src/components/map/CurrentLocation.tsx index 5961d25..022cca3 100644 --- a/src/components/map/CurrentLocation.tsx +++ b/src/components/map/CurrentLocation.tsx @@ -23,6 +23,7 @@ export const CurrentLocation: react.FC = ( return location !== null ? ( = (props: MarkerProperties) => { console.log(`Rendering Marker`); + useEffect(() => { + console.log(`Marker onMount, id:${props.id}`); + return () => { + console.log(`Marker onUnmount, id:${props.id}`); + cache.delete({ cacheId: 'points', key: props.id }); + }; + }, []); + if ( props.keyObject === undefined || props.zoom === undefined || @@ -31,11 +41,17 @@ export const Marker: react.FC = (props: MarkerProperties) => { y < props.viewPort.topLeft.y || y > props.viewPort.bottomRight.y + 1 ) { + cache.delete({ cacheId: 'points', key: props.id }); console.log( `Marker ${x}, ${y} out of viewport: ${JSON.stringify(props.viewPort)} ` ); return null; } + cache.set({ + cacheId: 'points', + key: props.id, + value: { id: props.id, coordinates: props.coordinates }, + }); return ( = (props: TrksegProperties) => { {trkseg[1] !== undefined ? ( <> = (props: TrksegProperties) => { { + const { cacheId, key, value } = params; + if (!_allCaches.has(cacheId)) { + _allCaches.set(cacheId, new Map()); + } + const k = _allCaches.get(cacheId); + k.set(key, value); + }, + get: (params: any) => { + const { cacheId, key } = params; + if (!_allCaches.has(cacheId)) { + return null; + } + const k = _allCaches.get(cacheId); + if (!k.has(key)) { + return null; + } + const value = k.get(key); + k.delete(key); + k.set(key, value); + return value; + }, + delete: (params: any) => { + const { cacheId, key } = params; + if (!_allCaches.has(cacheId)) { + return null; + } + const k = _allCaches.get(cacheId); + if (!k.has(key)) { + return null; + } + const value = k.get(key); + k.delete(key); + return value; + }, +}; + +export default cache;