Tributary inlet

_.md

[ Launch: Tributary inlet ] 5972394 by eighteyes

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":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}

inlet.js

var datum = [];
for ( i = 0; i < 100; i++ ) { datum.push(i) } 

var svg = d3.select('svg').append('g');

var color = d3.scale.linear().domain([0,100]).range(['blue','white'])

var r = svg.selectAll('g')
.data(datum)
.enter()
.append('rect')
.style('pointer-events','all')
.attr({ 'width':100, 'height':100, 'x':100,
       'y': function(d) {return d;},
       'fill': function(d) {return color(d); },
       'transform': function(d) {return 'translate(0 '+-d+') rotate(' + d + ')' }
      })
.on('mouseover', function(){
  console.log('hi');
  d3.select(this).moveToFront()
});


d3.selection.prototype.moveToFront = function() {
  return this.each(function(){
    this.parentNode.appendChild(this);
  });
};