I have not spent much time on javascript and have always avoided any opportunity to work with javascript related frameworks. Recently after many postponements I started working on D3.js and here is the output of what I could achieve over a weekend.
If you want to use the svg along with state and district codes visit my github repo
A few of the observations that I could made from the graph are
- Coastal regions have a better sex ratio.
- South India does better when compared to North India.
- I was assuming that Karnataka would have a better ratio than that of Bangalore. But I was surprised to find that AP does better than Karnataka.
- In-fact a viz done by a friend of mine addresses precisely that. As per the viz there is a lot of improvement over the last decade which kind of justifies my surprise ;)
Read further for credits and my learning resources.
Note that this is a very crude implementation. I wanted to get the working map out there and then work on improving features and code quality.
- DashingD3JS helped me get started and thinking with joins helped me understand joins better.
- I used the color palettes form Color Brewer. It has a nice set of palettes and comes shipped with D3. A nice graphical view of the same is a smart implementation done using D3.js and ColorBrewer again.
- I used some sample codes from here.
- I used the svg map from wikimedia
- It used the names and didn't use the district codes assigned by the Census 2011. There was no easy way of mapping these details.
- I used the official document from census and used this temporarily identify the missing codes and names.
- Most of the changes were because of the spelling mistake or abbreviations. I had to fix these manually.
- I ignored that fact that there can be different districts with same name in different states. This caused a little headache and tookup more than 3-4 hours to sort it out.
- I have shared the update svg map along with state and district codes on github
