Custom SVG Markers

This example illustrates how to add the capitals of South America on the map using custom SVG location pins.

Check out the code for this example on github.

Buenos AiresLa PazBrasiliaSantiagoBogotaQuitoGeorgetownParamariboCayenneAsuncionMontevideoCaracasLima

Markers in react-simple-maps can contain any shape. In this example we use a custom location marker shape to make the marker more unique.

Tabbing is enabled by default on both geographies and markers.

* The boundaries and the designations used on this map do not imply the expression of any opinion on the part of the react-simple-maps team or z creative labs and are used for illustrative purposes only. The boundaries and shapes are not part of the react-simple-maps library and are sourced from Natural Earth and

react-simple-maps is a library of React components to make SVG maps using d3-geo and topojson.

react-simple-maps was made at and is maintained by z creative labs.

Check out these mapping articles we wrote on Medium!
Copyright © Richard Zimerman 2017. MIT Licensed.