Image

Overlay images on specific map coordinates.

Installation

First, make sure you have the base map component installed:

npx shadcn@latest add https://terrae.vercel.app/maps/map.json

Then install the image component:

npx shadcn@latest add https://terrae.vercel.app/maps/map-image.json

Add an image overlay to your map by specifying the image URL and the four corner coordinates.

Control the transparency of the image overlay using the opacity prop.

Property	Type	Default	Description
`id`	string	required	Unique identifier for the image layer
`url`	string	required	URL of the image to overlay
`coordinates`	MapImageCorners	required	Four corner coordinates (top-left, top-right, bottom-right, bottom-left)
`opacity`	number	1	Image opacity (0-1)