Skip to content

Instantly share code, notes, and snippets.

@mbostock
Last active February 9, 2016 00:25
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 mbostock/1169680 to your computer and use it in GitHub Desktop.
Save mbostock/1169680 to your computer and use it in GitHub Desktop.
Dots
license: gpl-3.0
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
var width = 960,
height = 500;
var nodes = [];
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
var force = d3.layout.force()
.charge(-20)
.size([width, height])
.nodes(nodes)
.on("tick", tick)
.start();
function tick() {
svg.selectAll("circle")
.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
}
var interval = setInterval(function() {
var d = {
x: width / 2 + 2 * Math.random() - 1,
y: height / 2 + 2 * Math.random() - 1
};
svg.append("circle")
.data([d])
.attr("r", 1e-6)
.transition()
.ease(Math.sqrt)
.attr("r", 4.5);
if (nodes.push(d) > 300) clearInterval(interval);
force.start();
}, 30);
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment