Skip to content

Instantly share code, notes, and snippets.

@derekjwilliams

derekjwilliams/_.md

Created Jul 25, 2014
Embed
What would you like to do?
crossfilter for stoners
{"description":"crossfilter for stoners","endpoint":"","display":"svg","public":true,"require":[{"name":"rawcrossfilter (custom-filter)","url":"https://rawgit.com/enjalot/crossfilter/master/crossfilter.min.js"}],"fileconfigs":{"inlet.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},"style.css":{"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,"thumbnail":"http://i.imgur.com/9Cs2wPV.gif"}
var svg = d3.select("svg");
var xf = crossfilter();
var visits = xf.dimension(function(d) { return d.visits});
var forks = xf.dimension(function(d) { return d.nforks});
var users = xf.dimension(function(d) {
if(!d.user) {
return "anon";
}
if (d.user.login === "derekjwilliams") {
console.log(d);
}
return d.user.login;
});
function initData() {
xf.add(tributary.inlets);
//console.log(tributary.inlets[0]);
}
function render() {
users.filter("enjalot");
//visits.filter([2,500]);
//forks.filter([1,15]);
var userGroup = users.group().all().sort(function(a,b) {
return a.value < b.value? 1: -1;
});
var barWidth = d3.scale.linear()
.domain(d3.extent(userGroup, function(d) { return d.value }))
.range([1, 200]);
var userSel = svg.selectAll("g")
.data(userGroup);
var userEnter = userSel.enter()
.append("g")
.classed("user", true);
userEnter.append("text").classed("name", true);
userEnter.append("text").classed("number", true);
userEnter.append("rect");
userSel.attr({"transform": function(d,i) {
var x = 172;
var y = 36 + i * 22;
return "translate(" +[x,y] + ")";
}
})
userSel.select("text.name")
.text(function(d) { return d.key })
.attr("alignment-baseline", "hanging")
.attr("y", 3);
userSel.select("rect")
.attr({
width: function(d) { return barWidth(d.value) },
height: 20,
x: 5
})
userSel.select("text.number")
.text(function(d) { return d.value })
.attr("alignment-baseline", "hanging")
.attr("dx", function(d) {return 9+ barWidth(d.value)})
.attr("y", 3)
}
if (!tributary.inlets) {
d3.json("http://tributary.io/api/latest/created", function(err, response) {
tributary.inlets = response;
initData();
render();
})
} else {
initData();
render();
}
.user text {
alignment-baseline: hanging;
}
text.name {
text-anchor: end;
}
.user rect {
fill: #62AACC;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment