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

How do "Selections" work in D3? #26

Open TonyGoodDay2 opened 7 years ago

cmitchell74 commented 7 years ago

https://bost.ocks.org/mike/selection/

selections are a subclass of array; this subclass provides methods to manipulate selected elements, such as setting attributes and styles.

syerrapothu commented 7 years ago

Selection methods typically return the current selection, or a new selection, allowing the concise application of multiple operations on a given selection via method chaining.

For example, to set the class and color style of all paragraph elements in the current document:

d3.selectAll("p") .attr("class", "graf") .style("color", "red");

Source: https://github.com/d3/d3-selection/blob/master/README.md#selection

cmitchell74 commented 7 years ago

selections bind data to a DOM element

cmitchell74 commented 7 years ago

https://github.com/d3/d3-selection

Selections allow powerful data-driven transformation of the document object model (DOM): set attributes, styles, properties, HTML or text content, and more. Using the data join’s enter and exit selections, you can also add or remove elements to correspond to data.

TonyGoodDay2 commented 7 years ago

http://www.jeromecukier.net/blog/2013/03/05/d3-tutorial-at-strata-redux/ https://www.dashingd3js.com/binding-data-to-dom-elements

syerrapothu commented 7 years ago

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