block by emeeks e1d488a49c5bb7fb8957

Ch. 2, Fig. 18 - D3.js in Action

Full Screen

This is the code for Chapter 2, Figure 18 from D3.js in Action that creates rectangles with height based on the data bound to the selection. Rectangles are scaled to fit the small drawing area by utilizing d3.scale.linear() set as a polylinear scale, meaning it has multiple stops ([0,100,1000,24500]) that are mapped to different height values ([0,50,75,100]). As a result, the wide range of values in the data array can be visually represented on the same bar chart, though without an axis this technique would be very hard to understand.

index.html