Skip to content

Instantly share code, notes, and snippets.

@thadk
Created February 28, 2013 00:48
Show Gist options
  • Save thadk/5053270 to your computer and use it in GitHub Desktop.
Save thadk/5053270 to your computer and use it in GitHub Desktop.
Tributary inlet
{"description":"Tributary inlet","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"index.html":{"default":true,"vim":false,"emacs":false,"fontSize":12},"viz.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}
<!DOCTYPE html>
<meta charset="utf-8">
<style>
path {
stroke:#b73438; stroke-width:1; fill:transparent;
}
svg {
float:left;
}
#vis {
width: 600px;
height: 600px;
}
#matte {
background:#f1f1f1;
width: 35px;
height: 228;
padding:50px;
}
</style>
<body>
<div id='matte'>
<div id='vis'></div>
</div>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src='viz.js'></script>
</body>
var a = -90, b = 0, c = 90, d = 180;
var g = d3.select('#vis')
.selectAll('svg')
.data([a, b, a, b, d,
c, d, d, a, a,
b, a, d, b, c,
b, c, b, c, b,
c, d, c, d, b])
.enter()
.append('svg')
.attr({ width: 80, height: 80 })
.append('g')
.attr('transform', function(d) { return 'rotate(' + d + ', 40, 40)'; });
var line = d3.svg.line()
.x(function(d) { return d[0]; })
.y(function(d) { return d[1]; });
function unit(angle) { return [Math.cos(angle), Math.sin(angle)]; }
function mult(x, y) { return x.map(function(_) { return _ * y; }); }
function gen(i) {
var angle = Math.PI * 0.5 * (i / 30);
return [[0, 0],
mult(unit(angle), (1 / Math[(angle < Math.PI/4) ? 'cos' : 'sin'](angle) * 80))
];
}
g.selectAll('path.a')
.data(d3.range(0, 31).map(gen))
.enter().append('path')
.attr({ 'class': 'a', d: line });
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment