Skip to content

Interactive Dot Map

Draggable map with reactive dots

Interactive Dot Map preview image 1

Summary

Draggable map with reactive dots

Description

Create an elegant interactive world map directly in Framer.

Interactive Dot World Map uses lightweight canvas rendering and precomputed geographic data to deliver smooth interactions.

Choose between Simple and Detailed geography, drag horizontally to change the map center, and add customizable country or city labels using real latitude and longitude coordinates.

Features:

  • Accurate precomputed world geography

  • Simple and Detailed map styles

  • Infinite horizontal dragging

  • Mouse-reactive dots

  • Color, Scale, Repel, and Color + Repel interactions

  • Custom country and city locations

  • Real latitude and longitude positioning

  • Automatic SVG country flags

  • Custom flag and icon uploads

  • Custom typography, colors, labels, and markers

  • Animated pulsing location markers

  • Optional Antarctica

  • Responsive high-resolution canvas rendering

  • Keyboard navigation

  • Screen-reader descriptions and announcements

  • Visible keyboard focus indicators

  • Reduced-motion support

Ideal for portfolios, agencies, international companies, global teams, product websites, network visualizations, and location-based storytelling.

Rank history How rankings work →

110012001300130978/149/49/2610/1811/9
  • All · #2939

Details

More like this