🌍 Public
Viewing a saved revision (read-only)
6d21e3cf9b874c90aee594c93b6d35d6
Hello OpenLayers
This example shows a simple interactive map displaying a Stamen toner-lite basemap using OpenLayers within a React functional component. The Cartography component uses a useRef hook to create a map target and a useEffect hook to initialize an ol.Map instance with an ol.View centered on specified coordinates. The Basemap export defines an ol.layer.Tile layer with an ol.source.Stamen source. React’s state management stores the map and view objects, and cleanup calls map.setTarget(null) to free resources when the component unmounts.
AI-generated descriptionOpenLayers with React Starter code.