Check out a free preview of the full SVG Essentials & Animation, v2 course

The "Comments on D3" Lesson is part of the full, SVG Essentials & Animation, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Sarah briefly discusses the usage of using D3 while using GreenSock.


Transcript from the "Comments on D3" Lesson

>> Sarah Drasner: Before we go into timeline, I got a question during the break and one of the question was, were I used GreenSock with D3 or would I just use D3? I actually, usually use GreenSock with D3, and even Shirley has started using GreenSock with D3. Green Sock in D3 play really nicely together.

So you get everything on the page like, remember how I mentioned before, you get everything there and then you can hide or reveal things, or move things from there. So what I'll do is I'll get everything on the page with D3, snd then once it's in the DOM I'll manipulate it with GreenSock.

And you can even like hide things away with GreenSock and then bring them in. But D3 has a sense of things that aren't there yet, in a way that GreenSock doesn't. So D3 can kinda create things, and make things from scratch. GreenSock can't do that, it just knows, once it's in the DOM already.

So the only tricky part is making sure that D3 is done mounting everything, and then you have access to it with GreenSock, right? So you could use CSS to hide things initially. Get everything on the page, like just opacity 0 it. D3 gets everything on the page. And then GreenSock you'd go draw this on and do this cool stuff, morph this stuff and stuff.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now