Skip to content

Instantly share code, notes, and snippets.

@poezn poezn/_.md

Created Jan 23, 2014
Embed
What would you like to do?
Stack o' money
{"description":"Stack o' money","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}
var num = 50,
h = 20,
w = 50;
var data = d3.range(num);
var scale = d3.scale.ordinal()
.domain(data)
.rangeBands([400, 100]);
var bills = g.selectAll("rect")
.data(data);
bills
.enter().append("rect")
.attr({
"transform": function(d, i) {
var ty = -h,
tx = -w;
return "translate(" + [tx, ty] + ") skewX(20) skewY(20)"
},
"width": 50,
"height": 20
})
.style({
"fill": "#818B73",
"stroke-width": 1,
"stroke": "#464646",
"transform": "skew(36deg,0deg)"
})
;
bills
.transition()
.delay(function(d, i) {
return i * 12
})
.attr({
"transform": function(d, i) {
var ty = scale(i),
tx = w;
return "translate(" + [tx, ty] + ") skewX(20) skewY(0)"
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.