This is the fourth step of my first attempt to learn canvas. I want to improve a piece a made a few weeks ago about the division of occupations. The D3.js version has so many DOM elements due to all the small bar charts that it is very slow. Therefore, I hope that a canvas version might improve things
Thanks to a version of the circle packing that does away with the D3.js data binding made by Stephan Smola I was able to make a few adjustments to make the zooming more linear from point A to B. Next step, add the bar charts…
I wrote a more extensive tutorial around what I learned while doing this project in my blog Learnings from a D3.js addict on starting with Canvas in which this can be seen as step 4. See the previous, more jittery zoomable version here in which the code is still more base on d3.js
And if you want to see the final result, with everything up and running in canvas look here