Shadcn.io is not affiliated with official shadcn/ui
Map Traffic Heatmap
Interactive website traffic origin heatmap with globe view, country-sized markers, visitor count tooltips, and top countries panel built with mapcn, shadcn/ui, and Tailwind CSS
Visualize where your website visitors come from on a 3D globe with this React and Next.js block. Country markers scale by traffic volume, tooltips reveal visitor counts and bounce rates, and a side panel ranks your top traffic sources with session metrics. Built with TypeScript, mapcn Map with globe projection, MapMarker, MarkerContent, MarkerTooltip, MapControls, shadcn/ui Badge, and Tailwind CSS. Ideal for analytics dashboards, SaaS admin panels, and marketing intelligence tools.
Related Components
Space Launch Sites
Launch facility globe map
Demographic Overlay
Census data map overlay
Market Expansion
Market expansion planner map
Population Density
City density visualization
Restaurant Finder
Restaurant discovery map
FAQ
Was this page helpful?
Sign in to leave feedback.
Tourist Attractions
Interactive tourist attraction explorer map with category markers, rating stars, visit duration estimates, and attraction detail popups built with mapcn, shadcn/ui, and Tailwind CSS
Transit Routes
Public transit route map block for Next.js with bus and metro line routes in different colors, stop markers, schedule info, and line detail panel using mapcn map components and Tailwind CSS