Code to help Walter Gunter Jr. (@wegunterjr) with learning d3.js. based on: http://jsfiddle.net/wegunterjr/r92zG/
This is a variation of a stacked bar chart, where an additional dimension is mapped to width of the section. This additional dimension causes unnecessary complexity for the user.
Normal bar charts use a 1-dimensional area encoding (or redundantly encodes position and area), namely that the bars are all comparable in size, but fixed to one dimension.
By adding a second dimension (regardless of whether it is aesthetically pleasing), the usefulness of the encoding is still mapped to the area. Namely that the reader will interpret the smaller area as meaningful. Therefore it is recommended to map these dimensions with data that have a directly proportional relationship.
Modified http://mbostock.github.com/d3/d3.js?2.7.2 to a secure url
https://mbostock.github.com/d3/d3.js?2.7.2