Join Ray Villalobos for an in-depth discussion in this video Understanding SVG primitives, part of Data Visualization with D3.js.
…We're going to take a quick diversion away from D3 to get a feeling for…how SVG graphics are coded.…It's going to allow us to be better at creating those graphics and…making them interactive in the future.…Usually the first way you get to experience a computer program is to…create a Hello World application.…So the graphic equivalent of that is to learn to draw primitives,…which are simple shapes like rectangles, ellipses and circles.…So, this time I'm going to start with our same basic template, but…I'm going to clear out the script file, as well as the CSS document.…
And let me go ahead and close those.…And then I'm going to take this D3 section right here and just get rid of this chart.…And now we're ready to get started.…So, to create an SVG graphic, you can use the svg tag,…which looks like any other HTML tag.…Now, just like with any other tag, you can assign this tag attributes.…And typically for a graphic, you specify the width and height of your canvas.…So here we can say width equals and then some sort of value.…
- What is D3.js?
- Creating a basic document structure
- Controlling HTML DOM elements
- Binding data to the DOM
- Drawing SVG graphics with D3
- Using ordinal scales
- Adding events and transitions
- Working with data
- Creating and adjusting layouts
Skill Level Intermediate
1. Setting Up and Installing
What is D3.js?3m 18s
2. Learning the Basics
3. Working with SVG Graphics
4. Using D3 Methods
5. Using Data
6. Working with Layouts
Next steps2m 2s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.