6.3 Unsolved puzzles in Task 9
6.3.2 Puzzle two
Something I don’t understand but don’t have time to figure out:
I want to let the exiting label to turn red and move to the upper-right corner before disappearing, so I specified
.attr("x", w).attr("y", 0).after the transition syntaxes and before.remove(). However, I noticed that it just cannot move horizontally. It keeps within its original horizontal position.I just don’t know why and how Scott Murray’s codes worked. Why should we use
bars.enter()...here?How to get the transition in Scott Murray’s codes when updating the bars?
I used
dataset.pop(), which is supposed to delete the last data value. Yes, when I used
svg.selectAll("rect")
.data(dataset)
.exit()
.transition()
.attr("x", w)
.attr("y", h)
.remove()The exiting bar traveled from the left! Why???
6.3.3 Puzzle three from Day 40
I was redoing Task 9-2-1. The answer is Chapter 09/17_randomized_data.html.
The only difference is that I have already updated the xScale and yScale within the bar and text updating codes. Also, I made a “small” mistake: I put dataset = [] inside the for loop.
To make the changes more noticeable, change the color of the bar to red within within the bar and text updating codes. Here are the things I didn’t understand:
Why isn’t the red obscuring the colors of previous rects?
Why is there a larger gap between the start of the first bar?
See more information about d3 band scales here.