DataMaps

Customizable SVG map visualizations for the web in a single Javascript file using D3.js


Announcing DataMaps Hi-Res in 0.5.0

Thanks to work by Matteo Guarnerio, DataMaps now provides a higher resolution option, which provides much more details to country borders and islands, at the cost of a higher download size, which is about 129KB gzip'ed.

Using the higher resolution version is optional. To use the hi-res version, change the source file you bring into your page to the built hires version, named datamaps.world.hires.min.js:


Normal Resolution

Smaller file size, great for visualizations embedded into articles.

At small enough map sizes, the difference in resolution is less obvious, so stick with standard DataMaps for use cases that call for small maps.


When applying a custom projection to zoom into an area, like Western Europe, the low resolution starts to become more evident.

High Resolution

Larger file size, great for full-page map visualizations and zooming.

If you want higher resolution, you can use the hi-res version to get more details on country borders and islands.


Meanwhile when a custom projection is applied to the hi-res Datamap, more detail is visible throughout the map.


Fork me on GitHub