Marker
Add interactive markers to your map with popups and tooltips.
Installation
First, make sure you have the base map component installed:
npx shadcn@latest add https://terrae.vercel.app/maps/map.jsonThen install the marker component:
npx shadcn@latest add https://terrae.vercel.app/maps/map-marker.jsonRich Popups
Build complex popups with images, ratings, and action buttons using shadcn/ui components.
Avatar Markers
Use MarkerAvatar to display user avatars or profile images on the map. Perfect for showing team members, online users, or contributor locations with status indicators.
Draggable Marker
Create draggable markers that users can move around the map. Click the marker to see its current coordinates in a popup.
Live Position Marker
Track real-time positions with live data updates. This example shows the International Space Station position that updates every 5 seconds from a live API.