Data Visualization beginner: Learn processing, d3.js or other first?
I'm a visual / info designer and data analyst. I am an expert in Illustrator. I want to transition into dynamic data visualization. Preferably I want to utilize my vector files and connect them to a database. Having said that I want to become versed in data visualization programming.
What Route? I have tested 'processing' via an introductory lesson -- it's similar to the logic in Illustrator. I am considering d3.js. It looks like the consensus is to do a combination of 'processing' and d3. What program should I start with (knowing that I want to utilize my vector files).
Thank you in advance!
Answer
I give my vote for d3js and I'll share my learning tips. I was a beginner with d3.js when I suddenly I had to implement charts, widgets and "nice" (translation: complicated) visualization stuff.
Why d3? it runs in every browser of this era (IE9+) it requires no installation or plugins or special setup, just a couple of lines of code and you're good to go. And mobile phones can also run it with no extra effort.
The learning curve was horrible, but now that I know what I did wrong, I can share a better learning program to you.
- Go for the SVG tutorials. Forget about d3, and go for the basics... If you don't know the alphabet how can you write words and then sentences? The tutorial from Mozilla helped me a lot! https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial
- Now you can go for some d3 action. Don't go to the documentation, go for the tutorials first. https://github.com/mbostock/d3/wiki/Tutorials
The good stuff is in "Introduction", "Let’s Make a Bar Chart, Parts I, II & III" and the most important of all "General Update Pattern, Parts I, II & III". - Now see and analyze the examples, they all have source code and some comments.
Anyways, it all depends on your proficiency level of JavaScript, DOM and SVG.