Introduction
Welcome
()
Explaining D3
()
What you need to know
()
Using the exercise files
()
1. Refresher
Introduction
()
Recalling HTML basics
()
Understanding HTML5
()
Introducing SVG
()
Recalling CSS
()
Combining Javascript and D3
()
Understanding the DOM and the console
()
2. Making a Simple Bar Chart with D3
Introduction
()
Adding an SVG
()
Adding rectangles
()
Setting attributes for shapes
()
Seeing the code how the browser sees it
()
3. Basic Shapes, Courtesy of SVG
Introducing SVG shapes
()
Drawing circles
()
Drawing ellipses
()
Drawing lines
()
Rejecting polygons and polylines
()
Adding text
()
4. Advanced Shapes, with D3 and Path
Introducing path
()
Explaining generators
()
Drawing an area chart
()
Finding other generators
()
Introducing groups
()
5. Scales and Axes
Introducing scales
()
Creating a linear scale
()
Creating a linear axis
()
Positioning and formatting our axis
()
Creating a time scale
()
Creating a time series axis
()
Creating an ordinal scale and axis
()
Using colour scales
()
Introducing other scales
()
6. Importing Data into D3
Introducing external data
()
Parsing a CSV file
()
Drawing a line chart from CSV data
()
Using TSV and DSV
()
Parsing JSON
()
Parsing and mapping XML
()
Parsing a TXT file
()
Parsing HTML
()
Introducing other data methods
()
7. Additional Graphics with D3 Layout
Introducing layout
()
Making a tree from JSON
()
Making a Voronoi tessellation
()
Introducing other layouts
()
8. Preparing Your Data for Advanced Graphics
Data manipulation
()
Prepare stack data using map
()
Drawing a stack area chart
()
Advancing selections
()
Make flat data multidimensional
()
Filtering data
()
9. Interactivity
Introducing interaction
()
Making your graphic responsive
()
Adding interactivity with CSS
()
Adding interactivity with JavaScript
()
Introducing dispatch
()
Transitions
()
Dragging and zooming
()
10. Picking the Right Graphic
Picking the right graphic for your data
()
Time series
()
Text
()
Hierarchy
()
Geography
()
Distribution
()
Other
()
Conclusion
Further resources
()
Finding plugins
()
Using the API reference
()
Using D3 with other libraries
()
Summary
()
Ex_Files_D3js_EssT_Data.zip
(4.7 MB)