of values • See relationships among data points • See the parts of a whole • See the world • Track rises and falls over time Bar/Bubble charts Pie Charts Saturday, December 8, 12
}); d3.csv("pets.csv", function(error, data){} // Do logic here }); d3.tsv("immigrants.tsv", function(error, data){} // Do logic here }); Supports JSON, CSV, and TSV. Saturday, December 8, 12
.style("font-size", function(d) { return d + "px"; } ); Binds values to the first six paragraphs Sets font-size per bound paragraph Saturday, December 8, 12
16, 23, 42]) .text(String); p.enter().append("p") .text(String); If less than six paragraphs, then add until six exist. Create nodes for incoming data Saturday, December 8, 12
16, 23, 42]) .text(String); p.enter().append("p") .text(String); p.exit().remove(); Remove extra nodes Cleaning up your workspace Saturday, December 8, 12
120], w = 1280 - m[1] - m[3], h = 800 - m[0] - m[2], i = 0, root; var tree = d3.layout.tree() .size([h, w]); var diagonal = d3.svg.diagonal() .projection(function(d) { return [d.y, d.x]; }); var vis = d3.select("#body").append("svg:svg") .attr("width", w + m[1] + m[3]) .attr("height", h + m[0] + m[2]) .append("svg:g") .attr("transform", "translate(" + m[3] + "," + m[0] d3.json("flare.json", function(json) { root = json; root.x0 = h / 2; root.y0 = 0; function toggleAll(d) { if (d.children) { d.children.forEach(toggleAll); toggle(d); } } // Initialize the display to show a few nodes. root.children.forEach(toggleAll); toggle(root.children[1]); toggle(root.children[1].children[2]); toggle(root.children[9]); toggle(root.children[9].children[0]); update(root); Remember the Many-Eyes version of this data. Saturday, December 8, 12
Daniel Greenfeld
pydanny
reverentgeek
rmw
skipperchong
carmenhchung
keathley
productmarketing
clairelew
thoeni
jcasabona
![@pydanny Data Binding d3.selectAll("p") .data([4, 8, 15, 16, 23, 42])](https://files.speakerdeck.com/presentations/3b0ed96023b6013038ea12313d181141/slide_52.jpg){kind=link}
