Creating Clickable Browser-Based Maps

a.k.a. getting maps to do stuff :)


  1. US political map with outline highlights on hover

  2. Map with tooltips on hover

  3. Small sidbars that change on click

  4. Yes, it's a mall, but the bottom and side panes are a nice layout choice when lots of text accompanies the map

  5. A chrolopleth map seems like the way to go for political boundaries that highlight on hover

  6. Kanban of examples


  1. Map libraries with example images

  2. jQuery package for embedding clickable maps in HTML

  3. Seemingly cool d3-based React maps library, but the examples won't load?

  4. Leaflet is sweet!

  5. Simple component for displaying S VG maps

Tutorials & Other Code Resources

  1. Blog re: making interactive maps with React, CSS, SVG

  2. Topojson and d3-geo interactive map tutorial

  3. Low code option for cloropleth maps!

  4. Useful thread on hover SVG hover events in React

  5. Tutorial series that's also a nice example of interactive maps made with d3