Tributary inlet

_.md

[ Launch: Tributary inlet ] c444d37482523e9c518410e1c0e35ef5 by jkeohan

config.json

{"description":"Tributary inlet","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/EDTfHnY.png"}

inlet.js

var width = 800;
var height = 400;
var svg = d3.select('svg')
  .attr("width", width).attr("height",height)

var g = svg.append('g').attr("transform","translate(" + 50 + "," + 0 + ")")


var alpha = "abcdefghijklmnopqrstuvwxyz".split("");

function update(data) {
  
  var text = g.selectAll("text").data(alpha);

//ENTER
text.enter().append("text")
  .attr("x",function(d,i) { return i * 22; })
  .attr("y",height /2)
  .style("fill","green")
  .text(function(d) { return d; });

}

update(alpha)

var g2 = svg.append('g').attr("transform","translate(" + 50 + "," + -40 + ")")

var random = g2.selectAll(".random").data(shuffle(alpha))

function update2(d) {
random.enter()
.append("text")
.attr("x",function(d,i){ return i * 22 } )
.attr("y",height / 2 )
.text( function(d) {  return d } )

}

function shuffle (data) {
 // console.log(data)
 var rand = d3.shuffle(data).slice(0, Math.floor(Math.random() * 26 ))
 //console.log(rand)
  return rand
}

//shuffle(alpha)
//update2(shuffle(alpha))

setInterval(function() {
	update2(shuffle(alpha))
},1000)