var width = 960,
    height = 500;

var vertices = d3.range(40).map(function(d) {
  return [Math.random() * width, Math.random() * height];
})

var voronoi = d3.geom.voronoi()
    .clipExtent([[0, 0], [width, height]])

var polygons = voronoi(vertices)

var svg = d3.select('body').append('svg')
    .attr('width', width)
    .attr('height', height)

svg.dataAppend(polygons, 'path')
    .attr('d', function(d){ return 'M' + d.join('L') + 'Z' })


polygons.forEach(drawSpiral)

// drawSpiral(polygons[0])

function drawSpiral(polygon){
  var duration = 100
  var points = polygon.slice()


  setInterval(function(){
    var curPoint = points.shift()
    var nextPoint = points[0]
    svg.append('path')
        .attr('d', ['M', curPoint, 'L', curPoint].join(' '))
      // .transition().duration(duration)
        .attr('d', ['M', curPoint, 'L', nextPoint].join(' '))

    var percent = .1 //+ points.length/30
    points.push([
      curPoint[0]*(1 - percent) + nextPoint[0]*percent, 
      curPoint[1]*(1 - percent) + nextPoint[1]*percent])
  }, duration)  
}