Skip to content

Instantly share code, notes, and snippets.

@antulik
Created February 9, 2013 06:44
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 antulik/4744347 to your computer and use it in GitHub Desktop.
Save antulik/4744347 to your computer and use it in GitHub Desktop.
force_example
{"description":"force_example","endpoint":"","display":"svg","public":true,"require":[],"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}},"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}
var w = tributary.sw,
h = tributary.sh,
fill = d3.scale.category10(),
nodes = d3.range(100).map(Object)
var counter = 0;
nodes.forEach(function(d, i){
d.id = counter++;
});
var svg = d3.select("svg")
//.attr("width", w)
//.attr("height", h);
var vis = svg.append('g')
var force = d3.layout.force()
.nodes(nodes)
.links([])
.size([w, h])
.start();
function draw_nodes() {
var d = vis.selectAll("circle.node")
.data(nodes, function(d){return d.id})
d.enter()
.append("svg:circle")
.attr("class", "node")
.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; })
.attr("r", 8)
.style("fill", function(d, i) { return fill(d.id & 3); })
.style("stroke", function(d, i) { return d3.rgb(fill(d.id & 3)).darker(2); })
.style("stroke-width", 1.5)
.call(force.drag);
d.exit()
.attr('opacity', 1)
.transition()
.duration(1000)
.attr('r', 50)
.attr('opacity', 0)
.remove();
return d;
}
var node = draw_nodes();
force.on("tick", function(e) {
// Push different nodes in different directions for clustering.
var k = 6 * e.alpha;
console.log(k);
nodes.forEach(function(o, i) {
o.y += o.id & 1 ? k : -k;
o.x += o.id & 2 ? k : -k;
});
node.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
});
vis.on("click", function() {
var entering = d3.range(10).map(Object);
//nodes = d3.merge(nodes, entering)
entering.forEach(function(d, i){
d.id = counter++;
nodes.push(d);
nodes.splice(0, 1);
});
force.start()
node = draw_nodes()
});
a = nodes;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment