Skip to content

Instantly share code, notes, and snippets.

@enjalot
Created July 22, 2013 07:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save enjalot/6051919 to your computer and use it in GitHub Desktop.
Save enjalot/6051919 to your computer and use it in GitHub Desktop.
those waves
{"description":"those waves","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"style.css":{"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,"thumbnail":"http://i.imgur.com/lQQeVBb.png"}
var svg = d3.select("svg");
var num = 21;
var points = 50;
var yspace = 31;
var pi = Math.PI;
var waves = [];
d3.range(num).map(function(i) {
var wave = d3.range(points).map(function(p) {
var x = p;
var y = 0;
var n = points * (0.09 + 0.25 *(Math.cos(0.5904*i) + 1)/2);
var m = points * (0.6 + 0.1632 *(Math.cos(0.5904*i) + 1)/2);
if(x < n) {
y = 0;
} else if (x > m) {
y = 0;
} else {
y = (Math.sin(pi + x) + 1) * Math.random() * 4 * (Math.sin(-9.72*p/points -0.0048) + 1);
}
return {x: x, y: y}
})
waves.push(wave)
})
var xscale = d3.scale.linear()
.domain([0, points])
.range([50, tributary.sw - 50])
var yscale = d3.scale.linear()
.domain([0, 12])
.range([77,0])
var line = d3.svg.line()
.x(function(d,i) {
return xscale(d.x);
})
.y(function(d,i) {
return yscale(d.y);
})
.interpolate("basis-closed")
svg.selectAll("path.wave")
.data(waves)
.enter()
.append("path")
.classed("wave", true)
.attr("d", line)
.attr("transform", function(d,i) {
return "translate(" + [0, -7.9584 + yspace * i] + ")" });
#display {
background-color: black;
}
.wave {
fill: #ffffff;
fill-opacity: 0.999936;
stroke: #ACA7A7;
stroke-width: 3;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment