Binding Functions As Data

_.md

[ Launch: data as a function ] faa0032726b67ce6fa7a by markarios

config.json

{"description":"Binding Functions As Data","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"ajax-caching":true,"thumbnail":"http://i.imgur.com/17RcP7y.png"}

inlet.js

// An attempt to partially replicate "Binding Functions as Data",
// "Data Visualization with D3js Cook-Book" by Nick Qi Zhu,
// ISBN 978-1-78216-216-2

// A - damping function
// B - appends a new f to data when fs is called
// C - a data bind with functions as data
// D - we call each function with d(i)

var data = [];
var f = function(x) {return x*Math.sin(x);};  //A
var fs = function() { data.push(f); return data;} // B

function render() { 
var selection = d3.select("svg")
	.append("g")
	.attr("transform","translate(0,261)")
	.selectAll("circle")
	.data(fs); // C

selection.enter().append("circle");

selection.exit().remove();


selection.attr({
      "cy": function(d,i){ return d(i);}, // D 
      "r": "5.0px",
      "cx":function(d,i){return 4*Math.PI*i;},
      "fill":"#ff69b4"
	})
}

for(j=0;j<519;j++){
	render()}