control flow

example.js

// micro example for the d3.js day 1 course taught by @vicapow
// https://github.com/mbostock/d3/wiki/Selections#control
// is part of the API to look at
// most of this code is about readability
// the performance should be congruent through all options
// roughly

var circles = d3.selectAll('.circles').data([3, 2, 1, 0]);

// option one
circles.attr({
  cx: function(d, i) { return i; },
  r: function(d, i) { return d; }
});

// option two
circles
  .attr('cx', function(d, i) { return i; })
  .attr('r', function(d, i) { return d; });

// option three
circles.each(function(d, i) {
  d3.select(this).attr({ cx: i, r: d });
});

// option four-ish
function circleAttrs(d, i) {
  d3.select(this).attr({ cx: i, r: d });
}
function updateCircles(selection) {
  selection.each(circleAtts)
}
circles.call(updateCircles);