Africa map using Raphael.js

If you wanted to use an interactive US map on your website, you would find plenty of free options (like this, or this, or this). However, if you were looking for an interactive map of Africa, then you were out of luck. Until now.

Last week I combined a couple resources and built out an SVG map of Africa using the Raphael.js library. All the countries are accessible as HTML DOM objects and can be interacted with using CSS, Javascript, or the options provided by Raphael.js library. The path for each country is labeled, so you can easily delete paths and get a map containing a cluster of countries. Another small tweak to the transform allows you to scale the map to whatever size makes sense.

You can see the Africa Map demo here, or look at the contributed code up on Github.

After my years spent in Africa, I’ve retained a special place in my heart for the place. Hopefully this resource turns out to be useful to whatever Africa-focused business, non-profit, or government organization, happens to stumble across it.

Comments