Presentation
D3.js is a JavaScript library for manipulating documents based on data. At this moment you can check sources of barcamp (demos & slides).
Demos
Basic examples showing how to use powerful d3.js features.
Selections
The core concept to understand D3. Selections are arrays of elements in the document. Check how to select body and append svg or create 5 circles with specified params.
Scales
Functions that map from an input domain to an output range. Try to placing circle by array`s key or placing circle by array`s value. Scales are flexible so you can change SVG size to see scale still works. There's no problem with using 2 scales, but effect could be crazy unexpected. Other examples shows how to use scales for both coordinates and flip the visualisation by reversing scale range.
Transitions
Special type of selection where the operators apply smoothly over time rather than instantaneously. Check how to show circles in one second or show circles in time depending on radius size.
Colors
Constructing visualizations often involves working with colors. See how circles changes from red to green or circles uses built-in color scale. There's possible to use darker color for a stroke than for a fill and even interpolate colors from white to black. But if we talking about scales and colors more than minimal and maximum values could be used for an interpolation, like showing circles filled from orange, by green to purple.
Axes
This lets you focus on displaying the data, while the axis component takes care of the tedious task of drawing axes and labeled ticks. Check how to make horizontal axis.
Shapes
SVG has a number of built-in simple shapes, such as axis-aligned rectangles and circles. See how to create line chart or create area chart easily with generators.