Files
useOpenLayers/src/hooks/MapContainer.tsx
2025-12-15 08:15:22 -05:00

28 lines
726 B
TypeScript

import React, { useEffect, useRef } from "react";
import { useMapApi } from "./mapApi";
import { Map, View } from "ol";
interface Props {
children: React.ReactNode;
}
export function MapContainer({ children }: Props) {
const mapDivRef = useRef<HTMLDivElement>(null);
const { initializeMap } = useMapApi();
useEffect(() => {
if (!mapDivRef.current) return;
const map = new Map({
target: mapDivRef.current,
layers: [],
view: new View({
center: [0, 0],
zoom: 1,
})
});
initializeMap(map);
}, [mapDivRef.current, initializeMap]);
return <div ref={mapDivRef}>
{children}
</div>;
}