Logo
DocsExamplesGitHubGetting started

React Simple Maps

Create beautiful SVG maps in react with d3-geo and topojson using a declarative api.

npm i -S react-simple-maps@beta

World mapchart showing ND-GAIN country vulnerability data. See example

Why use
React Simple Maps?

Flexible

Flexible

It's just SVG. React Simple Maps consists of isolated helper components that can be freely composed. Creating and styling map charts is as simple as writing html layouts.

Read more
Extensible

Extensible

React Simple Maps seamlessly integrates with other libraries from the React ecosystem (e.g. react-annotation, react-spring, react-tooltip, styled-components, victory, vx, and many more)

Tiny

Tiny

React Simple Maps is a thin wrapper around d3-geo and topojson, providing a declarative API for making map charts. It doesn't add bloat and unnecesary dependencies.

Simple

Simple

React Simple Maps focuses on handling the tedious stuff, like topojson conversion, zooming, panning, and potential performance bottlenecks so you can focus on what matters; making cool map charts.

Examples

Custom markersCustom markers

Custom markers

Europe map with graticuleEurope map with graticule

Europe map with graticule

Map chart with tooltipMap chart with tooltip

Map chart with tooltip

Choropleth map chart of the US (quantize)Choropleth map chart of the US (quantize)

Choropleth map chart of the US (quantize)

USA states map with labelsUSA states map with labels

USA states map with labels

Zooming and pannningZooming and pannning

Zooming and pannning

See all examples

Newsletter

Sign up to the React Simple Maps newsletter and be the first one to know when we publish new stuff.

Hire Us!

Are you looking for someone to create beautiful mapcharts?

Contact us

React Simple Maps

Home
Documentation
Examples
GitHub

More Tools

Check out these other design and development tools by z creative labs.

Blobmaker
Get Waves

© 2019 z creative labs