Skip to content

Instantly share code, notes, and snippets.

@Radcliffe
Created December 19, 2013 08:00
Show Gist options
  • Save Radcliffe/8035870 to your computer and use it in GitHub Desktop.
Save Radcliffe/8035870 to your computer and use it in GitHub Desktop.
Covering a grid with circles
x1 y1 r1 x2 y2 r2 x3 y3 r3 x4 y4 r4 x5 y5 r5
1.5 0.5 1.58113883 1.5 1.5 1.58113883 2.166666667 2.833333333 2.173067468 0.5 0.5 3.535533906 2.5 2.5 1.58113883
1.5 0.5 1.58113883 2 2.5 2.5 1.5 2.5 1.58113883 2.5 1.5 2.121320344 3.166666667 2.833333333 1.178511302
1.5 0.5 1.58113883 2 2.5 2.5 1.5 2.5 1.58113883 2.5 1.166666667 1.900292375 2.5 2.5 1.58113883
1.5 0.5 1.58113883 1.5 2.5 1.58113883 1.666666667 2.333333333 2.357022604 2.5 1.5 2.121320344 3.5 2.5 1.58113883
1.5 0.5 1.58113883 1.5 2.5 1.58113883 1.5 1.5 2.915475947 2.166666667 1.5 1.900292375 4 1.5 2.5
1.5 0.5 1.58113883 1.5 2.5 1.58113883 1.5 1.5 2.915475947 3.166666667 1.5 2.635231383 2.5 1.5 1.58113883
1.5 0.5 1.58113883 2.5 2 2.5 1.833333333 3.5 1.900292375 2.5 1.5 1.58113883 2.5 2.5 1.58113883
3.5 0.5 3.535533906 2.5 2.5 2.915475947 1.5 2.5 1.58113883 2.5 1.5 1.58113883 3.166666667 2.166666667 1.178511302
3.5 0.5 3.535533906 1.5 2.5 1.58113883 -0.166666667 1.833333333 2.173067468 2.5 1.5 1.58113883 4.5 1.5 1.58113883
2 1 2.236067977 1 2 2.236067977 2 2 2.236067977 1.5 1.5 0.707106781 3.166666667 3.166666667 1.178511302
2 1.5 2.5 1.5 1.5 1.58113883 2 3.166666667 2.166666667 2.5 1.5 1.58113883 2 3.25 1.25
2 1.5 2.5 1.5 1.5 1.58113883 2 4 2 2.5 1.5 1.58113883 2 2.666666667 1.666666667
2 2 2.828427125 1.5 1.5 1.58113883 1.5 2.5 1.58113883 2.5 1.5 1.58113883 2.833333333 2.833333333 1.178511302
{"description":"Covering a grid with circles","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"circle-covers.csv":{"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,"thumbnail":"http://i.imgur.com/CBb6SUs.gif"}
var mesh = 20;
var offset = 80;
var tileHeight = 200;
var tileWidth = 200;
var columns = 4;
var gridSize = 5;
var numCircles = 5;
var scale = function(x) {return x*mesh + offset;};
var svg = d3.select("svg");
var data = tributary["circle-covers"];
var bind_data = function(data) {
var circle;
for (var i=0; i < data.length; i++) {
var g = svg.append("g")
.attr("transform","translate(" + ((i % columns)* tileWidth) + "," + (Math.floor(i/columns) * tileHeight) + ")");
var range = d3.range(numCircles);
g.selectAll("circle.solution").data(range).enter().append("circle").attr({
cx: function(d){ return scale(data[i]["x"+(d+1)]);},
cy: function(d){ return scale(data[i]["y"+(d+1)]);},
r: function(d){ return mesh * data[i]["r"+(d+1)];},
fill: "none",
stroke: "teal"
}).classed("solution", true);
range = d3.range(gridSize*gridSize);
g.selectAll("circle.dot").data(range).enter().append("circle").attr({
cx: function(d) { return scale(d % gridSize);},
cy: function(d) { return scale(Math.floor(d/gridSize));},
r: 3,
fill: "red"
}).classed("dot", true);
}
};
bind_data(data);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment