6.7 Task 9-2 Review

6.7.1 From Day 24

  • 9-2-2. if(){return } else{ return }

  • 9-2-4.

    • d3.select("p) rather than d3.select(p)

    • .on("click", ...) rather than .on("Click", ...)

    • xScale.domain([0, d3.max(dataset, function(d){ return ...}]). Be sure to add dataset.

  • 9-2-5.

    • It should be d3.select(this), rather than svg.select(this).

    • “start” can be placed either before or after duration() and “end” should be placed at the end of the circle-updating code.

  • 9-2-6. Only one transition can be active for a given element at any given time.

6.7.2 From Day 29

  • 9-2-5. Within .on("start", ...), you need to use d3.select(this), rather than svg.select(this).

  • 9-2-7. You can add many transitions you want. However, you cannot add a transition within in .on("start", ...), which is designed for immediate transformations, not interpolated ones.

For example, the following is okay:

svg.selectAll("circle")
     .data(dataset)
     .transtion()
     .duration(1000)
     .transition()
     .duration(1000)
     .
     .
     .
  • 9-2-9.
    • bars.enter().append("rect")... will return references to newly created element. Therefore, all the codes that follow will be used for this newly created bar, until you use merge().