search

DSContEd / IntroWebDevelopment

At the end of the course, students will be able to plan, design, and implement a web site using current standards and best practices.
1 stars 1 forks source link

What does the D3 .data operator do? #27

Open TonyGoodDay2 opened 7 years ago

cmitchell74 commented 7 years ago

The data operator joins an array of data (which can be numbers, objects or other arrays) with the current selection of DOM element(s)

syerrapothu commented 7 years ago

The data operator (binds|joins) input data to selected nodes.

TonyGoodDay2 commented 7 years ago

What happens if nothing exists on the DOM? Meaning..selectAll("p") but not p elements exist?

cmitchell74 commented 7 years ago

https://www.dashingd3js.com/binding-data-to-dom-elements

The D3.js SelectAll method uses CSS3 selectors to grab DOM elements. Unlike the Select method (where the first element is selected), the SelectAll method selects all the elements that match the specific selector string.

But wait! The basic HTML page doesn't contain any

yet. What is it actually doing?

What it is doing is selecting all of the

available on the page. Which in this case is none. So it returns an empty selection.

Later use of .data(theData) and .enter( ) will allow us to bind the data to the empty selection.