Skip to main content

Overlay

Anchor random react components to the map

Example#

Pigeon | © OpenStreetMap contributors

Code#

import { Map, Overlay } from 'pigeon-maps'
export function MyMap() {
return (
<Map height={300} defaultCenter={[50.879, 4.6997]} defaultZoom={11}>
<Overlay anchor={[50.879, 4.6997]} offset={[120, 79]}>
<img src='/img/pigeon.jpg' width={240} height={158} alt='' />
</Overlay>
</Map>
)
}

Options#

anchor#

At which coordinates [lat, lng] to anchor the overlay with the map.

offset#

Offset in pixels [x, y] relative to the anchor.

Attribution#

Pigeon image by Robert Claypool