Draw canvas#

Let's make some SVG elements! This step will look exactly like our line chart code. First, we find an existing DOM element (#wrapper), and append an <svg> element.

Then we use attr to set the size of the <svg> to our dimensions.width and dimensions.height. Note that these sizes are the size of the "outside" of our plot. Everything we draw next will be within this <svg>.

const wrapper = d3.select("#wrapper")

  .append("svg")

    .attr("width", dimensions.width)

    .attr("height", dimensions.height)