This video covers how to add an axis using time scale.
- [Instructor] Now we're going to add an X axis based…on our X scale.…So we can delete that console log thing…that we had there.…And we'll keep our structure…by popping it under here.…And it's as straight forward as it was before.…For X axis, D3 dot axis, bottom.…The scale is X.…And that's all we need.…Now that won't run until we call it…so we're going to call it down here.…Chart group append g.…We'll give that a class attribute.…
There ya go.…Class, axis X.…And then we call our axis generator…which is X axis.…And then we check and refresh…and low and behold we have an X axis.…Now it's not where we wanted it…but it is there and beautifully formatted…as I'm sure you'll agree in purple and blue.…So the X axis has been positioned at zero zero.…So why isn't it showing up here…which is the zero zero location of the page?…And that's because we've added the X axis…into chart group and chart group has been transformed.…
50 pixels rightwards and 40 pixels downward.…So although the X axis defaults…to a position of zero zero,…it has in fact been shifted…
- Making a simple bar chart with D3
- Understanding SVG graphics
- Drawing basic shapes
- Adding text
- Using generators and the path element
- Creating a scale and axes
- Importing data into D3
- Creating trees and Voronoi tessellations
- Preparing your data for advanced graphics
- Adding interactivity and transitions
- Choosing the right graphic
- Finding D3.js plugins
Skill Level Intermediate
Data Visualization for Data Analystswith Bill Shander1h 31m Beginner
Learning Data Visualization (2014)with Bill Shander3h 41m Beginner
2. Making a Simple Bar Chart with D3
3. Basic Shapes, Courtesy of SVG
4. Advanced Shapes, with D3 and Path
5. Scales and Axes
6. Importing Data into D3
7. Additional Graphics with D3 Layout
8. Preparing Your Data for Advanced Graphics
10. Picking the Right Graphic
- 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.