Data is usually bound to DOM elements in D3 using the general update pattern. We used it to create the bar charts in the last chapter, and in several small code fragments in this chapter. In this section, we will demonstrate it using a simple example that focuses on the selection methods and avoids other APIs, such as transitions and scales. You can follow the example by downloading and modifying the GUP/1-template.html file from the GitHub repository for this chapter or running the individual files for each step.
Although most D3 applications use SVG, we will use HTML for this example, since the goal is to understand the binding mechanisms, and the structure of HTML is probably more familiar to most readers. At the end of this chapter, you will have the opportunity to create a full example using SVG.
The best way to understand how D3 works is to use...