Data binding techniques are very powerful in D3.js because they enable us to generate graphical content based on data. In general, with the data-driven approach, we can declare the graphical elements to match the data instead of looping through the data and drawing the elements one by one.
D3-Selections provide the
.data([values[, key]]) method to bind an array of arbitrary data to a Selection. It will return a new Selection that stores the bound data internally and binds every element of the data array to an element of the Selection.
values argument is an array of values or a function that returns an array of values. With the second optional
key argument, we can specify a function ...