Muslim pilgrims per country

I seem to making a lot of maps lately, but it's gives these nice pictures that tell a good story.

Leiden is home to couple of fine museums one of which is Museum Volkenkunde (Museum of Ethnology). At the moment there is an exhibition on the Hajj, the pilgrimage to Mecca called 'Longing for Mecca'. It's on display until March 8th so you have to quick to go and see it.
My girlfriend, Elke Spiessens, did some research for this exhibitions especially tying to find the numbers behind the Hajj. Such as how do people travel to Mecca, or how many stones were used to throw at the Jamarat (stoning of the Devil) and also how many people travel from which country.
That last one struck me as an opportunity to make a nice visualization. These numbers are hard to find exactly and for a lot of countries they couldn't be found so there are some gray spots on the map.

In this map I included a bar plot so you can compare the different countries a bit easier and I thought filling in the numbers with arrows to the countries gives you a bit more feeling than just the colors. Small note, I didn''t have the number of pilgrims that comes from inside of Saudi Arabia. Also most numbers are estimates and based on quotas that are set. So every country can only send a certain amount of pilgrims, which is done for crowd control. The Hajj take place during 5 days in which over 3 million pilgrims visit Mecca and the surrounding sites.

Muslims per country

Looking back at this map I can strike you as odd. The top three countries that send the most pilgrims are Indonesia, Pakistan and India, where the first and third might not fit your typical middle eastern Muslim premise. 

If we look at the map found of Wikipedia showing the percentage of Muslims per country we see the following.

The percentage of Muslims per country

Which is I guess more what you'd expect. Countries in the Middle East and Northern Africa colored dark where a large majority of the people are Muslim (sometimes close to 99%). If you look carefully you can already see that Indonesia has a large Muslim majority  (about 86%). But if we look at the map showing the absolute number of Muslims per country we can understand the map with the number of pilgrims a lot better.

Absolute number of Muslims per country

This map also comes from Wikipedia and can immediately see what's happening. The top three countries Indonesia, Pakistan and India have a lot of citizens and so even if the percentages aren't as high as the Middle Eastern countries it adds up. So it turns out that almost two-thirds of the Muslims live in Asia-Pacific and I think that is a nice eye-opener.

How it's made

I just want to say a few words on how this map came together. As I mentioned in previous posts a great inspirational source is Visualize This by Nathan Yau and making this map was helped a lot by the examples found in that book. The data I had was run through a Python script to create the CSS styling needed to color in the SVG map. The bar plot was made in R, exported as a PDF, imported in Inkscape, styled to fit the map and then added. All the numbers and arrows were put in by hand in Inkscape.

Since this post is more focused on the story than on the technique I hope you find it informative. If you like to learn more about the Hajj and the people that take this pilgrimage go see that exposition before it closes.

How close are you to a school building?

In Leiden, The Netherlands there was quite a stir when a convicted pedophile was placed in a new house after being released. This left people in the city and especially the neighborhood angry and concerned. One of the points the mayor of Leiden made was that everybody needs to live somewhere. People who objected said out that there are schools nearby the house that was appointed and that of course made it a bad choice.

These arguments made me think. Is it possible to find a house that is not near a school?
My initial guess was that it was nearly impossible.

The data

So, to lighter subjects. Let's make a map! I first looked for a list of all the school in Leiden. That includes higher education. I must say that afterwards I realized I probably missed some school buildings. I didn't check if a certain primary or secondary school had more then one location. I also forgot some of the higher education facilities. And lastly I totally ignored kindergartens and such, which in my guess adds 30+ more locations.

The list I found for schools had addresses and postal codes included, as well as the type of the school. It took some time to get everything in a nice spreadsheet, but it was ok. I used Google's mapsengine to put all these locations on a map. There are some simple tutorials on the basics of Mapsengine, so within a few minutes I had a nice looking and useful map. I made a screenshot as you can see below or you can follow this link to play with interactively.

Locations of schools in Leiden

If you follow the link you'l be able to click on every location and see which school it is and it's properties.

You can also put your mouse over of one of the schoolmtypes in the list on the left and the school that belong to that type are highlighted. Pretty neat right. You can style this in a couple of ways and share it across the web.

Mapsengine is a really easy tool to use but in my opinion it's possibilities are restricted. For instance the border of the municipality had to be drawn in by hand. Since I only had to do this once this was no big deal. But Google Maps draws this shape if you search for Leiden, why isn't that feature included here?

Circles

When working on this is was thinking of a site that used Google Maps to show the impact of different atomic bombs on your favorite location. It draws circles around a position to show which areas are destroyed by the fire, which by the air blast, etc etc. Seems simple right, draw a circle around a point on the map. Sadly Mapsengine doesn't have this feature. What I wanted to do was draw a circle around every school with a radius of let's say 500 meters. I mean, that's close by right? Some browsing led me to a site called Freemapstools. You can upload a list of GPS coordinates plus the radii of the circles you want to draw and it makes a map with said circles. I did have to get all the GPS coordinates first. For that I used the website GPSCoordinaat, which only works for dutch addresses I'm afraid. I was just to lazy to find a different way to transform that data so I just filled in every address by hand. Sometimes doing a monotonous job is faster than trying to automate it.

Plugging all the coordinates in Freemapstools gave me the following map.

Circles of 500 m around school locations

Freemapstools allows you to export this map to a .kml file which you can import in Google Earth. (please comment if this doesn't work) That should look something like the image below.

Google Earth version

This allows to some zoom in nicely to check out those few areas that are not covered by a circles. Some of the empty spots are industrial areas or sport facilities and a large part is the city's center. Remember that I forgot a couple of locations and I didn't include kindergartens so a proper map would be probably be filled more than the above maps.

Conclusions

So what can we conclude from all this? 

1) Making a map is still a lot of work and not fully satisfactory

I really wanted to have both maps in one. The locations with the information on every school and the circles around them. And it would have been even better if those radii were adjustable so it would be more insightful. The radius of 500 meters was just a number I picked that sounded nice. A different radius like 200 meters or one kilometer would create a different story.

2) You're always close to a school building in Leiden

Leiden has a lot of people in a small area and a lot of schools, you can't really change that.

Map of Belgian municipalities and JSFiddle

In previous posts in showed the work I did on maps of The Netherlands. After that I thought it would be nice to see if I could do the same for Belgium. A benefit of looking at Belgian municipality borders don't change as much as the Dutch ones do.
As ever Wikipedia was a good source for a SVG version of the map I was looking for.

Map of Belgium with all the municipalities

There were only two problems. In the most recent maps of The Netherlands every municipality was a path and had it's name in the Id tag. You've guessed it, the Belgian map didn't have this. All the borders between two areas were a separate line. One municipality could be defined by maybe 5 lines but not one single area. So I needed some way turning all these lines into closed paths and putting the right name in the right path.

Inkscape SVG editing

I must add that Belgium has a very complex political system and maybe that is why they have over 400 municipalities.
To go from the border lines to paths I used a simple bucket fill in Inkscape. I think you lose some resolution in this process but for what I intend to do it's just important to get all the areas in the right place.
I found out that Inkscape has an Object Properties window (shift+ctrl+o if you're wondering) were you can change i.e. the Id and Title properties of an object in your SVG file. I had to use several .jpg maps which had the names of the municipalities on them and overlaid them with the empty SVG map.
This process cost me a couple of hours but I'm pleased with the result.

JSFiddle

It's possible to put an SVG directly into a blog. If you go to the HMTL mode you can just paste the SVG code in your post and it should show in the final version. But if it's too big it doesn't seem to work. So to show the map I made I had to try something else that didn't involve making my own website. I chose JSFiddle, a nice website to allows to create an account and to try out HTML, Javascript, etc and to share it with other developers.
The map, as is, can be found here. In this version of the map every municipality is one path, where the Id name and the Title are filled in. So if you hover with your mouse over an area you can see it's name (Title).

Future Work

If you would want to color every path individually to make a choropleth you still need to do some work and I intend to do that.
One thing I would like to add to the map is the different regions that exist, the governments, the districts, etc.
I also need some data to visualize. The Belgian government has some sites where they share data, but for now I didn't find them that insightful.
When I've made some examples I hope to post them soon.