Introduction to D3

[mabehal-zuqyadeek]

Curran Kelleher has a very good knack for teaching. Explains everything so anyone on any level can follow. Very rare skill to have in an instructor.

Saw that it was almost 100 minutes but i just couldn't stop watching/listening. Pretty cool! Watching this at work! :)

[Aksoar]

You are an excellent instructor. I literally have 0 programming experience and only know some basic HTML, CSS and JS, yet I immediately grasped everything in this tutorial. Very well thought-out, good pacing.
I was intimidated after reading some online materials about D3, but this video increased my motivation to learn more!
Thanks!

[gman]

Curran, you made this in the perfect time when I was looking for a tut on using Webgl which lead me to learning about 3js which lead me to Mike Bostock's site that I couldn't get anything to work from or from Github. You, my friend are my friend for life! You were a Godsend! You are a great teacher too!!! You take the time to explain every line and what it does! That was what I needed. I'm an old Cobol programmer but can still pick up on other types of code and how it works, so I don't have CSS, Java or any of that but your video walks me through all of this and takes me to where I want to be! Thank you very very very much!!

[canttouchthis]

This is SO much better than reading the intro to D3 article (which was super text heavy). Thank you so much. This is very clear.

[vjk]

Seen and read so many D3 tutorials. 20 mins into the D3 section and you’ve already topped them all. Terrific job. 👍🏻

[hugom]

Thanks for uploading this Curran. About 100x clearer than the other course I was watching.

[ywwang]

I have 0 experience with d3 before and I find this tutorial extremely helpful, especially the chaining behaviors are very well-explained.

If you start with d3 v4.X, there are two tweaks you need to make from the video scripts to make you code behave:
(1) change d3.scale.linear() to d3.scaleLinear();
(2) The chaining behavior seems a little different in v4.X. If you follow the code and do something like below, the chain is somehow broke after the first line, so you will get all your circles lay on top of each other as if there were only one circle.

circles.enter().append("circle").attr("r", 5);
circles
.attr("cx", function(d){ return xScale(d.sepal_length); })
.attr("cy", function(d){ return yScale(d.petal_length); });

To properly assign "cx" and "cy" to let the circles scatter, all you need to change is to remove the";" and the standalone "circles" line, like below.

circles.enter().append("circle").attr("r", 5)
.attr("cx", function(d){ return xScale(d.sepal_length); })
.attr("cy", function(d){ return yScale(d.petal_length); });


I'm absolutely new and I've wrestling for hours to find the above workaround. Please tell me if my understanding is wrong or there is better solution to this.

[AsifMehedi]

I've watched and read many d3 tutorials, and I have to agree with Harish that this one is by far the best. Curran has an amazing ability to break down complex and difficult ideas into easily digestible pieces. Thank you.

[johngentz]

I've been looking for a teacher like you for a long time... You are gifted thanks!

[HarishNarayanan]

Thank you. This is perhaps the clearest tutorial I've ever seen. The the way you paced it stepping from basic concepts to more comprehensive examples really clicked with my brain.

Now to run off and try to visualise all the things with D3.

[henriquegn]

I have a list of a hundred tutorials and courses about dataviz in d3.
But this video is the first one that made me start to code without losing time searching for other stuffs that I need to know or download before learning.
Thank you so much!

[dmitryfill]

Great tutorial. Probably the best I have seen. Starting with practical examples and keep slowly building up on them, explaining the changes are very easy to follow and understand! Curran, you have a talent for teaching! Looking forward to more courses from you!

[jezzikah]

Thanks so much for this! Learned a lot. I'm an Android/Java dev who was just tasked to do JS and D3 work and I really have forgotten how to do web dev with all its quirks. The fact that you're so thorough in explaining everything really helped me heaps. Again, thanks!

[pannick]

This is very clear and useful. Covered the must-know of D3 for people who just started with D3. Well done!

[kennethm.]

Excellent sir (Slow clap...)...I also began learning Angular through your tutorial and now I've learnt D3 through you too. Much appreciated for your generosity to share your knowledge.

[shaikshavalisyed]

Excellent on each and every concept with a clear picture of code explanation. Thanks a lot Currran Kelleher it helps me for learning D3 JS.

[BenjaminEggerstedt]

This is still gold today! :) I‘ve been using D3js for some visualisations and wanted to finally understand it (and not just copy examples). I‘ll certainly look through this again, playing with the examples. Thank you!

[LGtheCat]

Whenever someone asks me to teach them d3, I don't even try to do it because this video is the best way to learn from

[peterhorn]

Well done Curran. This was a pleasure to watch! D3 is an amazing library, but I was having some trouble learning from the written tutorials. I'm glad I found your video. You explain the the enter/append/exit/remove concept very well. That's a good way to do it for beginners, and then the crazy enter/exit stuff can be left for more advanced users.