Adding an<svg>tag and sizing it with D3

In <indexentry content=" tag:sizing, with D3"> the index.html, at the top of <body>, before <indexentry content=" tag:adding"> your script tags, add an <svg> tag:

<body>
    <svg></svg>
    <script src="https://d3js.org/d3.v5.min.js"></script>
    <script src="app.js" charset="utf-8"></script>
</body>

If we examine the Elements tab of our dev tools, we'll <indexentry content=" tag:adding"> see the svg element has <indexentry content=" tag:sizing, with D3"> been placed. In Chrome, it has a default width/height of 300 px/150 px:

In app.js, remove your previous console.log statements and create variables to hold the ...

Get D3.js Quick Start Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.