Getting Started with D3

Errata for Getting Started with D3

Submit your own errata for this product.


The errata list is a list of errors and their corrections that were found after the product was released. If the error was corrected in a later version or reprint the date of the correction will be displayed in the column titled "Date Corrected".

The following errata were submitted by our customers and approved as valid errors by the author or editor.

Color Key: Serious Technical Mistake Minor Technical Mistake Language or formatting error Typo Question Note Update



Version Location Description Submitted By Date Submitted Date Corrected
PDF
Page 4
Cleaning the Data

The book mentions /code and /viz directories, whereas the directories within the example code bundle are named /cleaning_code and /visualisations, respectively.

Note from the Author or Editor:
The reviewer is correct. Please change the mentions of /code and /viz to /cleaning_code and /visualisations respectively. If the British English is a problem here please adjust the code folders accordingly.

Mikael Rinnetm√§ki  Jul 26, 2012 
PDF, ePub
Page 19
last paragraph

Earlier on the page margin=50 and width=700. This line: var x_scale = d3.scale.linear() .range([margin,width-margin]) .domain(x_extent); uses width and width-margin. Which I read to be 50 and 700-50 which leads to [50,650]. However the first sentence of the last paragraph reads: The x_scale now maps the extent of the data onto the range [40, 660]. It should be [50, 650] or needs an explanation of where the 10 pixels went.

Note from the Author or Editor:
Please change the [40,660] to [50,650] and 'between 40 and 660' to 'between 50 and 650' at the bottom of page 19.

Becka11y  Aug 27, 2012 
Safari Books Online
20
Using div Tags to Create a Horizontal Bar Chart

In the function: function draw(data) { ....... .style("width", function(d){return d.count/100 + "px"}) ........ } should be .style("width", function(d){return Math.round(d.count/100) + "px"}) otherwise div bars are not rendered properly (i.e. width must be an integer) P.S. Please excuse the wrong page number, this is my estimate. I am a safari user, thus I do not get the correct print page number.

Note from the Author or Editor:
Please change the code as suggested by the reviewer. It's actually on page 12 of the book, at the top.

jDLC  Aug 29, 2012 
PDF
Page 21
4th paragraph (line 13 from bottom)

"time_axis" should be "x_axis"

Note from the Author or Editor:
Please make the change suggested by the reviewer

Karl Broman  Jun 29, 2012 
PDF
Page 25
7 lines from bottom

Replace "width" with "height" in .attr("width", height+margin)

Note from the Author or Editor:
Please make the change suggested by the reviewer.

Karl Broman  Jun 29, 2012 
Printed
Page 25
lower third of page

Within the code for "Setting up the Viewport", d3.select("body") .append("svg") .attr("width", width+margin) .attr("height", height+margin) .append(g) .attr("class", "chart"); should be: d3.select("body") .append("svg") .attr("width", width+margin) .attr("height", height+margin) .append("g") .attr("class", "chart"); Just a set of missing "" around the g element.

Note from the Author or Editor:
The errata is correct - the g needs quotes around it

Joe Kokenge  Jan 30, 2013 
Other Digital Version
31
Bottom of pg. 31, before "Warning"

Initially, the javascript to set-up the dimensions of the svg viewport is: var margin = 50, width = 700, height = 300; On pages 32-33, however, where the x_scale code is presented, var x_scale = d3.scale.linear() .range([margin, width - margin]), . domain(x_extent); it is said that the range returned is [40, 660.] So, I assume the initial margin should be set to 40 instead of 50.

Note from the Author or Editor:
In the final paragraph of page 19 in the print book, please change both instances of 40,660 to 50,650 to be consistent with the code.

jkokenge  Dec 05, 2012 
PDF
Page 34
line 10

Replace ísubway_wait.jsoní with subway_wait.json. Change the font style from regular to italic.

Note from the Author or Editor:
Please make the change suggested by the reviewer.

Włodek Bzyl  Jul 16, 2012 
Printed
Page 36
second line

The css is closed with a single ">", not a full </style> tag.

Note from the Author or Editor:
Please change the second line on page 36 from ">" to </style>

Matthew Ruttley  Jul 12, 2012 
PDF
Page 37
the last two code examples

Replace: var key_items = d3.select("#key") .selectAll("div") .data(data) .enter() .append("div") .attr("class","key_line") .attr("id",function(d){return d.line_id}); with: var key_items = d3.select("#key") .selectAll("div") .data(data) .enter().append("div") .attr("class", "key_line"); and replace: key_items.append("div") .attr("id", function(d){return "key_square_" + d.line_id}) .attr("class", "key_square"); with: key_items.append("div") .attr("class", function(d) { return "key_square " + d.line_id; });

Note from the Author or Editor:
Please make the final change suggested by the reviewer. So this means remove the line " .attr("id", function(d){return "key_square_" + d.line_id})" and replace the line ".attr("class", "key_square");" with ".attr("class", function(d) { return "key_square " + d.line_id; });"

W&#322;odek Bzyl  Jul 16, 2012 
PDF
Page 37
line 3

Replace Date(2008, 0, 1) with Date(2009, 0, 1)

Note from the Author or Editor:
The reviewer is correct - the Date needs to be changed to 2009.

W&#322;odek Bzyl  Jul 17, 2012 
ePub
Page 38
Chapter 3: Setting up the Viewport

The svg attribute for "width" is set twice with width+margin and height+margin.

Note from the Author or Editor:
on page 25 of the print book, in the penultimate code block, please change the line .attr("width", height+margin) to .attr("height", height+margin)

Roy C  Aug 30, 2012 
PDF
Page 39
line 21

Replace: filtered_data = data.filter(function(d){return d.line_id === id}); with: var filtered_data = data.filter(function(d){ return d.line_id === id; });

Note from the Author or Editor:
the reviewer's semi-colon is certainly good practice. Please introduce it.

W&#322;odek Bzyl  Jul 17, 2012 
PDF
Page 40
line 8 from bottom

Replace: .attr("class", id.split("_")[1]); with .attr("class", "timeseries " + id);

Note from the Author or Editor:
In the final code example on page 40 please change the middle block to read var g = d3.select('#chart') .append('g') .attr('id', id) .attr('class', 'timeseries ' + id)

W&#322;odek Bzyl  Jul 17, 2012 
PDF
Page 43
United Kingdom

The following code has an error. g.selectAll("circle") .on("mouseout.tooltip", function(d){ d3.select("text." + d.line_id) .transition() .duration(500) .style("opacity",0) .attr("transform","translate(10, -10)") .remove(); }); The line d3.select("text." + d.line_id) should be d3.select("text#" + d.line_id)

Note from the Author or Editor:
the revier is correct - the period after text should actually be a #

Anonymous  Jan 20, 2013