diff --git a/pdfs/axes.pdf b/pdfs/axes.pdf index 10f2cb6..f23ab33 100644 Binary files a/pdfs/axes.pdf and b/pdfs/axes.pdf differ diff --git a/pdfs/margins.pdf b/pdfs/margins.pdf index 7462fb8..ac41b58 100644 Binary files a/pdfs/margins.pdf and b/pdfs/margins.pdf differ diff --git a/pdfs/scales.pdf b/pdfs/scales.pdf index cd96899..187097b 100644 Binary files a/pdfs/scales.pdf and b/pdfs/scales.pdf differ diff --git a/scales_and_axes.Rmd b/scales_and_axes.Rmd index 384d9d2..767c8d1 100644 --- a/scales_and_axes.Rmd +++ b/scales_and_axes.Rmd @@ -30,21 +30,21 @@ Try other numbers: `myscale(3);`, `myscale(2.5);`, `myscale(7);`, etc. Add inner padding and try again. -See diagram here: https://github.com/d3/d3-scale#band-scales +More on band scales here: [https://d3js.org/d3-scale/band](https://d3js.org/d3-scale/band) > *Be sure to use `d3.scaleBand()`, not `d3.scaleOrdinal()` for this use case. -### Bar chart +### Exercise : vertical bar chart #### `d3.scaleBand()` {-} *IDVW2* Chapter 9, pp. 150-153 -Here `d3.scaleBand()` is used to create an `xScale` function to convert bar numbers to pixels. Change the `w` parameter and observe how the bars are resized to fit on the SVG. +Create the vertical bar chart shown below by filling in the lines marked ADD [in this file](https://raw.githubusercontent.com/jtr13/d3book/main/code/d3.scaleBand_exercise.html){target="_blank"} and uncommenting them. (Note that we are not yet employing a linear scale for the y-axis.) -[Code for download](https://raw.githubusercontent.com/jtr13/d3book/main/code/d3.scaleBand.html){target="_blank"} +[Solution](https://raw.githubusercontent.com/jtr13/d3book/main/code/d3.scaleBand.html){target="_blank"} #### `d3.scaleLinear()` {-}