Skip to content

Instantly share code, notes, and snippets.

@d3indepth
Last active August 23, 2016 13:33
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save d3indepth/e3b16f8ca441adfe4ffcd2f6d7b0bba5 to your computer and use it in GitHub Desktop.
Circle packing (from introduction)
license: gpl-3.0
height: 840
border: no
Film Genre Lead Studio Audience score % Worldwide Gross Year
27 Dresses Comedy Fox 71 160.308654 2008
(500) Days of Summer Comedy Fox 81 60.72 2009
A Dangerous Method Drama Independent 89 8.972895 2011
A Serious Man Drama Universal 64 30.68 2009
Across the Universe Romance Independent 84 29.367143 2007
Beginners Comedy Independent 80 14.31 2011
Dear John Drama Sony 66 114.97 2010
Enchanted Comedy Disney 80 340.487652 2007
Fireproof Drama Independent 51 33.467 2008
Four Christmases Comedy Warner Bros. 52 161.834 2008
Ghosts of Girlfriends Past Comedy Warner Bros. 47 102.22 2009
Gnomeo and Juliet Animation Disney 52 193.967 2011
Going the Distance Comedy Warner Bros. 56 42.05 2010
Good Luck Chuck Comedy Lionsgate 61 59.192128 2007
He's Just Not That Into You Comedy Warner Bros. 60 178.84 2009
High School Musical 3: Senior Year Comedy Disney 76 252.044501 2008
I Love You Phillip Morris Comedy Independent 57 20.1 2010
It's Complicated Comedy Universal 63 224.6 2009
Jane Eyre Romance Universal 77 30.147 2011
Just Wright Comedy Fox 58 21.569 2010
Killers Action Lionsgate 45 93.4 2010
Knocked Up Comedy Universal 83 219.001261 2007
Leap Year Comedy Universal 49 32.59 2010
Letters to Juliet Comedy Summit 62 79.18 2010
License to Wed Comedy Warner Bros. 55 69.307224 2007
Life as We Know It Comedy Independent 62 96.16 2010
Love & Other Drugs Comedy Fox 55 54.53 2010
Love Happens Drama Universal 40 36.08 2009
Made of Honor Comedy Sony 61 105.962734 2008
Mamma Mia! Comedy Universal 76 609.473955 2008
Marley and Me Comedy Fox 77 206.073 2008
Midnight in Paris Romance Sony 84 148.66 2011
Miss Pettigrew Lives for a Day Comedy Independent 70 15.173694 2008
Monte Carlo Romance 20th Century Fox 50 39.664 2011
Music and Lyrics Romance Warner Bros. 70 145.896422 2007
My Week with Marilyn Drama The Weinstein Company 84 8.258 2011
New Year's Eve Romance Warner Bros. 48 142.04 2011
Nick and Norah's Infinite Playlist Comedy Sony 67 33.527293 2008
No Reservations Comedy 64 92.60105 2007
Not Easily Broken Drama Independent 66 10.7 2009
One Day Romance Independent 54 55.241 2011
Our Family Wedding Comedy Independent 49 21.37 2010
Over Her Dead Body Comedy New Line 47 20.71 2008
P.S. I Love You Romance Independent 82 153.093505 2007
Penelope Comedy Summit 74 20.741996 2008
Rachel Getting Married Drama Independent 61 16.61 2008
Remember Me Drama Summit 70 55.86 2010
Sex and the City Comedy Warner Bros. 81 415.253258 2008
Sex and the City 2 Comedy Warner Bros. 49 288.35 2010
She's Out of My League Comedy Paramount 60 48.81 2010
Something Borrowed Romance Independent 60.183 2011
Tangled Animation Disney 88 355.08 2010
The Back-up Plan Comedy CBS 47 77.09 2010
The Curious Case of Benjamin Button Fantasy Warner Bros. 81 285.431 2008
The Duchess Drama Paramount 68 43.305978 2008
The Heartbreak Kid Comedy Paramount 41 127.76665 2007
The Invention of Lying Comedy Warner Bros. 47 32.4 2009
The Proposal Comedy Disney 74 314.7 2009
The Time Traveler's Wife Drama Paramount 65 101.33 2009
The Twilight Saga: New Moon Drama Summit 78 709.82 2009
The Ugly Truth Comedy Independent 68 205.3 2009
Twilight Romance Summit 82 376.661 2008
Twilight: Breaking Dawn Romance Independent 68 702.17 2011
Tyler Perry's Why Did I get Married Romance Independent 47 55.862886 2007
Valentine's Day Comedy Warner Bros. 54 217.57 2010
Waiting For Forever Romance Independent 53 0.025 2011
Waitress Romance Independent 67 22.179483 2007
WALL-E Animation Disney 89 521.283432 2008
Water For Elephants Drama 20th Century Fox 72 117.094 2011
What Happens in Vegas Comedy Fox 72 219.367646 2008
When in Rome Comedy Disney 44 43.04 2010
You Will Meet a Tall Dark Stranger Comedy Independent 35 26.66 2010
Youth in Revolt Comedy The Weinstein Company 52 19.62 2010
Zack and Miri Make a Porno Romance The Weinstein Company 70 41.941 2008
<!DOCTYPE html>
<meta charset="utf-8">
<head>
<title>Circle packing layout</title>
</head>
<style>
body {
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 9px;
}
circle {
fill: black;
opacity: 0.15;
}
text {
fill: white;
text-anchor: middle;
}
</style>
<body>
<svg width="820" height="820">
<g class="wrapper" transform="translate(10, 10)">
</g>
</svg>
<script src="//d3js.org/d3.v4.min.js"></script>
<script>
var packLayout = d3.pack()
.size([800, 800]);
function arcSVG(mx0, my0, r, larc, sweep, mx1, my1) {
return 'M'+mx0+','+my0+' A'+r+','+r+' 0 '+larc+','+sweep+' '+mx1+','+my1;
}
function make(root) {
var nodes = root.descendants();
var u = d3.select('.wrapper')
.selectAll('g.node')
.data(nodes);
var nodes = u.enter()
.append('g')
.classed('node', true)
.attr('transform', function(d) {
return 'translate(' + d.y + ',' + d.x + ')';
});
nodes.append('circle')
.attr('r', function(d) {
return d.r;
});
nodes.each(function(d, i) {
var g = d3.select(this);
var label = d.depth === 0 ? '' : d.depth === 3 ? d.data.Film : d.data.key;
if(d.depth === 3) {
g.append('text')
.style('font-size', d3.min([3 * d.r / label.length, 16]))
.attr('dy', '0.3em')
.text(label);
} else if(d.depth > 0) {
var r = d.r - 10;
g.append('path')
.attr('d', arcSVG(-r, 0, r, 1, 1, r, 0))
.attr('id', 'label-path-' + i)
.style('fill', 'none')
.style('stroke', 'none');
g.append('text')
.append('textPath')
.attr('xlink:href', '#label-path-' + i)
.attr('startOffset', '50%')
.style('font-size', '10px')
.style('fill', 'white')
.text(d.data.key);
}
});
}
function ready(err, data) {
var nest = d3.nest()
.key(function(d) { return d.Genre; })
.key(function(d) { return d['Lead Studio']; })
.entries(data);
nest = {
key: 'root',
values: nest
};
var root = d3.hierarchy(nest, function(d) {
return d.values;
}).sum(function(d) {
return d['Worldwide Gross'] === undefined ? null : d['Worldwide Gross'];
});
packLayout(root);
make(root);
}
d3.csv('films.csv', ready);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment