trigonometric bars

_.md

[ Launch: trigonometric bars ] 769430d6258ff107d6f8 by omniwired

config.json

{"description":"trigonometric bars","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"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}

inlet.js

var svg = d3.select("svg")

color = d3.scale.category20();

var pos = 67;

for(var i=-10;i<50;i++) {
  svg.append('line')
  .attr({
    y1: Math.cos(i) * pos,
    y2: 0,
    x1: i * 7.8352,
    x2: i * 0.599999999999994,
    stroke: color(i),
    'stroke-width': '1em',
    transform: 'translate (292, 164)'
  }).transition()
  .duration(2000)
  .attr({
    x1: i * 21,
    x2: i * 21
  })
}

for(var i=0;i<50;i++) {
  svg.append('line')
  .attr({
    y1: 0,
    y2: 0,
    x1: i * 31,
    x2: i * 13,
    stroke: color(i),
    'stroke-width': '1em',
    transform: 'translate (100, 387)'
  }).transition()
  .duration(2000)
  .attr({
    y2: Math.sin(i) * pos,
    x1: i * 21,
    x2: i * 21
  })
}