Stakeholder briefing · Tech Lead & PM

US Map alternatives — comparison

Three working POCs deliver the same UX (map · dropdown · quick-pick · gallery filter). This page compares them on license terms, commercial cost, dependencies, bundle weight, and the practical pros and cons of each option. Pricing as of 2026-04-29; check the linked vendor pages for current tiers.

Criterion Alt 1 — jQuery + Raphael Alt 2 — Simplemaps HTML5 Alt 3 — Raw SVG (vanilla)
Approach jQuery plugin; renders SVG via Raphael Branded vendor plugin; Raphael bundled internally Hand-rolled vanilla JS over an inlined SVG
Personal / non-commercial Free (BSD 2-Clause) Free (branded; mandatory link-back to simplemaps.com) Free (attribution appreciated, not required)
Commercial use Free — BSD permits commercial use; copyright + license must be retained Paid — Individual $99 (lifetime, 1 domain, 12-mo updates). Higher tiers: Developer / Business — simplemaps.com/us. Free — no paid tier exists
Branding requirement None (BSD copyright header in JS) Free tier must keep the simplemaps.com link visible; paid tier removes the requirement None
Runtime dependencies jQuery 1.12.4 + Raphael 2.x (both bundled in the project) None (Raphael bundled inside usmap.js) None
Vendor weight on disk jQuery ~85 KB + Raphael 198 KB + plugin 93 KB ≈ 376 KB JS usmap.js 257 KB + mapdata.js 15 KB ≈ 272 KB JS us.svg ≈ 75 KB (no JS dependency)
Estimated gzipped weight ~110 KB ~70 KB ~10 KB
Built-in features Hover, click, labels, heat-map styling Hover, click, labels, popups, zoom, regions, locations Hand-rolled per-POC: hover, click, centroid labels, zoom (wheel + buttons + pinch + drag-to-pan)
State coverage 50 + DC (territory variant ships in the same package) 50 + DC + 5 territories (territories hidden by default) 50 + DC
Responsive design (mobile-first) Plugin renders into a fixed-size box (Raphael internally does the SVG sizing). We get responsiveness by wrapping #map in an aspect-ratio container and forcing width:100% on the rendered child. Works on mobile, but font-sized labels on tiny viewports get cramped. No touch-specific tap behavior — uses normal click events. Built-in: main_settings.width = "responsive". The plugin re-renders SVG to fit its parent and exposes touch-friendly tap-to-zoom out of the box. Best mobile story of the three — popups and zoom degrade gracefully on small screens. We control responsiveness completely. Inlining the SVG, removing fixed width/height, and setting preserveAspectRatio gives clean fluid scaling. Smallest mobile payload; touch & pointer events handled by native click delegation.
Hover affordance Yes — plugin's stateHoverStyles with animated transitions Yes — built-in state_hover_color + smooth fade Yes — pure CSS path:hover rule (after stripping the SVG's inline fill on load)
Programmatic highlight (from dropdown) $('#map').usmap('trigger', code, 'click') + Raphael .attr({fill}) Mutate state_specific[code].color + simplemaps_usmap.refresh() Toggle a CSS class on the matching <path>
Customizability High — Raphael path API is fully exposed Medium — config-driven; usmap.js is minified for the free tier Highest — full DOM control, every CSS & JS hook is yours
Maintenance status Repo archived 2020-03-24 — no further updates upstream Active commercial product (paid tier ships 12–24 months of updates) Static asset — no maintenance needed
Best for Existing jQuery codebases willing to live with an unmaintained dep Feature-rich demos / dashboards with budget for the commercial license Modern, framework-agnostic stacks & long-lived projects

Pros & cons

Alternative 1

jQuery + Raphael

Pros

  • BSD 2-Clause — free for commercial use, no branding tax
  • Well-documented plugin API (events, options, per-state styles)
  • Raphael is fully exposed if we ever need custom drawing
  • Smallest learning curve if the host app already uses jQuery

Cons

  • Hard dependency on jQuery — new friction for modern stacks
  • Plugin uses deprecated jQuery APIs (.curCSS()) — pinned to jQuery 1.12.4
  • Upstream repo archived since 2020; community support thin
  • Largest disk footprint of the three
Alternative 2

Simplemaps HTML5

Pros

  • Zero JS dependencies — drops in cleanly anywhere
  • Batteries included: zoom, regions, popups, locations, labels
  • Vendor support tier available; product is actively maintained
  • Cleanest config-driven model (mutate state_specific, call refresh())

Cons

  • Paid commercial license required — $99 / domain (or higher tiers)
  • Free tier requires a visible link back to simplemaps.com
  • Largest gzipped vendor JS of the three
  • Source is minified at the free tier — debugging needs the dev console
Alternative 3

Raw SVG + vanilla JS

Pros

  • By far the smallest footprint (≈10 KB gzipped)
  • Zero library lock-in; trivially portable to any framework
  • CSS-only hover and active styles — easy to theme
  • Fully MIT-equivalent license; safe for any use, no attribution required
  • Future-proof — no upstream dependency that can rot

Cons

  • Every feature beyond click + highlight (zoom, regions, popups) must be built
  • Higher up-front engineering effort than the plugin alternatives
  • No built-in labels or location markers

Recommendation matrix

Pick Alt 3 if you want zero recurring cost, minimum bundle weight, and full control — best long-term match for a modern codebase.

Pick Alt 2 if popups / zoom / regions matter and there is budget for the commercial license; the demo polish is hard to match without engineering work.

Pick Alt 1 only if the host app is already jQuery-first and the team is comfortable owning an archived dependency.

Live POCs · Alt 1 · Alt 2 · Alt 3
Sources · jQuery US Map (BSD 2-Clause) · Simplemaps HTML5 · Simplemaps SVG
← Back to overview