atroche/README.md

## README.md

      
    Raw
  

              README.md
            
          
    A treemap recursively subdivides area into rectangles; the area of any node in the tree corresponds to its value. This example uses color to encode different packages of the Flare visualization toolkit. Treemap design invented by Ben Shneiderman. Squarified algorithm by Bruls, Huizing and van Wijk. Data courtesy Jeff Heer.

  
## index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: auto;
  position: relative;
  width: 960px;
}

form {
  position: absolute;
  right: 10px;
  top: 10px;
}

.node {
  border: solid 1px white;
  font: 10px sans-serif;
  line-height: 12px;
  overflow: hidden;
  position: absolute;
  text-indent: 2px;
}

</style>
<form>
  <label><input type="radio" name="mode" value="size" checked> Size</label>
  <label><input type="radio" name="mode" value="count"> Count</label>
</form>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>

var margin = {top: 40, right: 10, bottom: 10, left: 10},
    width = 960 - margin.left - margin.right,
    height = 500 - margin.top - margin.bottom;

var color = d3.scale.category20c();

var treemap = d3.layout.treemap()
    .size([width, height])
    .sticky(true)
    .value(function(d) { return d.size; });

var div = d3.select("body").append("div")
    .style("position", "relative")
    .style("width", (width + margin.left + margin.right) + "px")
    .style("height", (height + margin.top + margin.bottom) + "px")
    .style("left", margin.left + "px")
    .style("top", margin.top + "px");

d3.json("politicians.json", function(error, root) {
  var node = div.datum(root).selectAll(".node")
      .data(treemap.nodes)
    .enter().append("div")
      .attr("class", "node")
      .call(position)
      .style("background", function(d) { return d.children ? color(d.name) : null; })
      .text(function(d) {
        if (d.children) {
          return null;
        } else if (d.size > 30000) {
          return d.name;
        }
      });

  d3.selectAll("input").on("change", function change() {
    var value = this.value === "count"
        ? function() { return 1; }
        : function(d) { return d.size; };

    node
        .data(treemap.value(value).nodes)
      .transition()
        .duration(1500)
        .call(position);
  });
});

function position() {
  this.style("left", function(d) { return d.x + "px"; })
      .style("top", function(d) { return d.y + "px"; })
      .style("width", function(d) { return Math.max(0, d.dx - 1) + "px"; })
      .style("height", function(d) { return Math.max(0, d.dy - 1) + "px"; });
}

</script>

## politicians.json
{
  "name":"politicians",
  "children":[
    {
      "name":"Liberal",
      "children":[
        {
          "name":"Tony Abbott",
          "size":92104
        },
        {
          "name":"Eric Abetz",
          "size":4768
        },
        {
          "name":"John Alexander",
          "size":2139
        },
        {
          "name":"Karen Andrews",
          "size":864
        },
        {
          "name":"Chris Back",
          "size":1181
        },
        {
          "name":"Bob Baldwin",
          "size":3199
        },
        {
          "name":"Guy Barnett",
          "size":1786
        },
        {
          "name":"Cory Bernardi",
          "size":3276
        },
        {
          "name":"Simon Birmingham",
          "size":4992
        },
        {
          "name":"Julie Bishop",
          "size":20201
        },
        {
          "name":"Sue Boyce",
          "size":1419
        },
        {
          "name":"Jamie Briggs",
          "size":4192
        },
        {
          "name":"David Bushby",
          "size":1805
        },
        {
          "name":"Steven Ciobo",
          "size":3626
        },
        {
          "name":"Richard Colbeck",
          "size":1092
        },
        {
          "name":"Helen Coonan",
          "size":3448
        },
        {
          "name":"Mathias Cormann",
          "size":6255
        },
        {
          "name":"Peter Dutton",
          "size":5972
        },
        {
          "name":"Alan Eggleston",
          "size":366
        },
        {
          "name":"Paul Fletcher",
          "size":2913
        },
        {
          "name":"Josh Frydenberg",
          "size":3124
        },
        {
          "name":"Joanna Gash",
          "size":2016
        },
        {
          "name":"Natasha Griggs",
          "size":1490
        },
        {
          "name":"Alex Hawke",
          "size":5113
        },
        {
          "name":"Joe Hockey",
          "size":53780
        },
        {
          "name":"Gary Humphries",
          "size":3246
        },
        {
          "name":"Greg Hunt",
          "size":8012
        },
        {
          "name":"Steve Irons",
          "size":2014
        },
        {
          "name":"Dennis Jensen",
          "size":1611
        },
        {
          "name":"Ewen Jones",
          "size":370
        },
        {
          "name":"Craig Kelly",
          "size":233
        },
        {
          "name":"Andrew Laming",
          "size":3204
        },
        {
          "name":"Sussan Ley",
          "size":2687
        },
        {
          "name":"Louise Markus",
          "size":601
        },
        {
          "name":"Russell Matheson",
          "size":337
        },
        {
          "name":"Scott Morrison",
          "size":9247
        },
        {
          "name":"Kelly O'Dwyer",
          "size":5360
        },
        {
          "name":"Andrew Robb",
          "size":7630
        },
        {
          "name":"Stuart Robert",
          "size":4541
        },
        {
          "name":"Wyatt Roy",
          "size":7227
        },
        {
          "name":"Patrick Secker",
          "size":1419
        },
        {
          "name":"Tony Smith",
          "size":3121
        },
        {
          "name":"Andrew Southcott",
          "size":2187
        },
        {
          "name":"Sharman Stone",
          "size":1104
        },
        {
          "name":"Dan Tehan",
          "size":904
        },
        {
          "name":"Alan Tudge",
          "size":970
        },
        {
          "name":"Malcolm Turnbull",
          "size":139414
        },
        {
          "name":"Bert Van Manen",
          "size":399
        },
        {
          "name":"Ken Wyatt",
          "size":4147
        }
      ]
    },
    {
      "name":"Labor",
      "children":[
        {
          "name":"Mark Arbib",
          "size":8587
        },
        {
          "name":"Sharon Bird",
          "size":2310
        },
        {
          "name":"Chris Bowen",
          "size":9121
        },
        {
          "name":"David Bradbury",
          "size":5747
        },
        {
          "name":"Tony Burke",
          "size":17354
        },
        {
          "name":"Nick Champion",
          "size":3147
        },
        {
          "name":"Jason Clare",
          "size":5157
        },
        {
          "name":"Trish Crossin",
          "size":1121
        },
        {
          "name":"Kate Ellis",
          "size":26340
        },
        {
          "name":"Joel Fitzgibbon",
          "size":4433
        },
        {
          "name":"Peter Garrett",
          "size":19841
        },
        {
          "name":"Steve Georganas",
          "size":3168
        },
        {
          "name":"Steve Gibbons",
          "size":3962
        },
        {
          "name":"Julia Gillard",
          "size":324059
        },
        {
          "name":"Jill Hall",
          "size":2337
        },
        {
          "name":"Ed Husic",
          "size":5793
        },
        {
          "name":"Stephen Jones",
          "size":3369
        },
        {
          "name":"Mike Kelly",
          "size":4676
        },
        {
          "name":"Catherine King",
          "size":2836
        },
        {
          "name":"Kate Lundy",
          "size":13564
        },
        {
          "name":"Rob Mitchell",
          "size":1886
        },
        {
          "name":"Shayne Neumann",
          "size":1906
        },
        {
          "name":"Deb O'Neill",
          "size":2054
        },
        {
          "name":"Julie Owens",
          "size":529
        },
        {
          "name":"Louise Pratt",
          "size":2727
        },
        {
          "name":"Bernie Ripoll",
          "size":2599
        },
        {
          "name":"Amanda Rishworth",
          "size":2428
        },
        {
          "name":"Kevin Rudd",
          "size":1180
        },
        {
          "name":"Janelle Saffin",
          "size":944
        },
        {
          "name":"Nick Sherry",
          "size":3192
        },
        {
          "name":"Bill Shorten",
          "size":16172
        },
        {
          "name":"Ursula Stephens",
          "size":3548
        },
        {
          "name":"Craig Thomson",
          "size":5263
        },
        {
          "name":"Kelvin Thomson",
          "size":1430
        }
      ]
    },
    {
      "name":"Greens",
      "children":[
        {
          "name":"Adam Bandt",
          "size":23959
        },
        {
          "name":"Bob Brown",
          "size":53944
        },
        {
          "name":"Sarah Hanson-Young",
          "size":17661
        },
        {
          "name":"Scott Ludlam",
          "size":9047
        },
        {
          "name":"Christine Milne",
          "size":13167
        },
        {
          "name":"Rachel Siewert",
          "size":3589
        }
      ]
    },
    {
      "name":"Nationals",
      "children":[
        {
          "name":"George Christensen",
          "size":1512
        },
        {
          "name":"Barnaby Joyce",
          "size":261
        },
        {
          "name":"John Williams",
          "size":1033
        }
      ]
    },
    {
      "name":"other",
      "children":[
        {
          "name":"Steve Fielding",
          "size":2825
        },
        {
          "name":"Robert Oakeshott",
          "size":13285
        }
      ]
    }
  ]
}

## thumbnail.png

      
    Raw
  

              thumbnail.png
	<!DOCTYPE html>
	<meta charset="utf-8">
	<style>

	body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin: auto;
	position: relative;
	width: 960px;
	}

	form {
	position: absolute;
	right: 10px;
	top: 10px;
	}

	.node {
	border: solid 1px white;
	font: 10px sans-serif;
	line-height: 12px;
	overflow: hidden;
	position: absolute;
	text-indent: 2px;
	}

	</style>
	<form>
	<label><input type="radio" name="mode" value="size" checked> Size</label>
	<label><input type="radio" name="mode" value="count"> Count</label>
	</form>
	<script src="http://d3js.org/d3.v3.min.js"></script>
	<script>

	var margin = {top: 40, right: 10, bottom: 10, left: 10},
	width = 960 - margin.left - margin.right,
	height = 500 - margin.top - margin.bottom;

	var color = d3.scale.category20c();

	var treemap = d3.layout.treemap()
	.size([width, height])
	.sticky(true)
	.value(function(d) { return d.size; });

	var div = d3.select("body").append("div")
	.style("position", "relative")
	.style("width", (width + margin.left + margin.right) + "px")
	.style("height", (height + margin.top + margin.bottom) + "px")
	.style("left", margin.left + "px")
	.style("top", margin.top + "px");

	d3.json("politicians.json", function(error, root) {
	var node = div.datum(root).selectAll(".node")
	.data(treemap.nodes)
	.enter().append("div")
	.attr("class", "node")
	.call(position)
	.style("background", function(d) { return d.children ? color(d.name) : null; })
	.text(function(d) {
	if (d.children) {
	return null;
	} else if (d.size > 30000) {
	return d.name;
	}
	});

	d3.selectAll("input").on("change", function change() {
	var value = this.value === "count"
	? function() { return 1; }
	: function(d) { return d.size; };

	node
	.data(treemap.value(value).nodes)
	.transition()
	.duration(1500)
	.call(position);
	});
	});

	function position() {
	this.style("left", function(d) { return d.x + "px"; })
	.style("top", function(d) { return d.y + "px"; })
	.style("width", function(d) { return Math.max(0, d.dx - 1) + "px"; })
	.style("height", function(d) { return Math.max(0, d.dy - 1) + "px"; });
	}

	</script>
	{
	"name":"politicians",
	"children":[
	{
	"name":"Liberal",
	"children":[
	{
	"name":"Tony Abbott",
	"size":92104
	},
	{
	"name":"Eric Abetz",
	"size":4768
	},
	{
	"name":"John Alexander",
	"size":2139
	},
	{
	"name":"Karen Andrews",
	"size":864
	},
	{
	"name":"Chris Back",
	"size":1181
	},
	{
	"name":"Bob Baldwin",
	"size":3199
	},
	{
	"name":"Guy Barnett",
	"size":1786
	},
	{
	"name":"Cory Bernardi",
	"size":3276
	},
	{
	"name":"Simon Birmingham",
	"size":4992
	},
	{
	"name":"Julie Bishop",
	"size":20201
	},
	{
	"name":"Sue Boyce",
	"size":1419
	},
	{
	"name":"Jamie Briggs",
	"size":4192
	},
	{
	"name":"David Bushby",
	"size":1805
	},
	{
	"name":"Steven Ciobo",
	"size":3626
	},
	{
	"name":"Richard Colbeck",
	"size":1092
	},
	{
	"name":"Helen Coonan",
	"size":3448
	},
	{
	"name":"Mathias Cormann",
	"size":6255
	},
	{
	"name":"Peter Dutton",
	"size":5972
	},
	{
	"name":"Alan Eggleston",
	"size":366
	},
	{
	"name":"Paul Fletcher",
	"size":2913
	},
	{
	"name":"Josh Frydenberg",
	"size":3124
	},
	{
	"name":"Joanna Gash",
	"size":2016
	},
	{
	"name":"Natasha Griggs",
	"size":1490
	},
	{
	"name":"Alex Hawke",
	"size":5113
	},
	{
	"name":"Joe Hockey",
	"size":53780
	},
	{
	"name":"Gary Humphries",
	"size":3246
	},
	{
	"name":"Greg Hunt",
	"size":8012
	},
	{
	"name":"Steve Irons",
	"size":2014
	},
	{
	"name":"Dennis Jensen",
	"size":1611
	},
	{
	"name":"Ewen Jones",
	"size":370
	},
	{
	"name":"Craig Kelly",
	"size":233
	},
	{
	"name":"Andrew Laming",
	"size":3204
	},
	{
	"name":"Sussan Ley",
	"size":2687
	},
	{
	"name":"Louise Markus",
	"size":601
	},
	{
	"name":"Russell Matheson",
	"size":337
	},
	{
	"name":"Scott Morrison",
	"size":9247
	},
	{
	"name":"Kelly O'Dwyer",
	"size":5360
	},
	{
	"name":"Andrew Robb",
	"size":7630
	},
	{
	"name":"Stuart Robert",
	"size":4541
	},
	{
	"name":"Wyatt Roy",
	"size":7227
	},
	{
	"name":"Patrick Secker",
	"size":1419
	},
	{
	"name":"Tony Smith",
	"size":3121
	},
	{
	"name":"Andrew Southcott",
	"size":2187
	},
	{
	"name":"Sharman Stone",
	"size":1104
	},
	{
	"name":"Dan Tehan",
	"size":904
	},
	{
	"name":"Alan Tudge",
	"size":970
	},
	{
	"name":"Malcolm Turnbull",
	"size":139414
	},
	{
	"name":"Bert Van Manen",
	"size":399
	},
	{
	"name":"Ken Wyatt",
	"size":4147
	}
	]
	},
	{
	"name":"Labor",
	"children":[
	{
	"name":"Mark Arbib",
	"size":8587
	},
	{
	"name":"Sharon Bird",
	"size":2310
	},
	{
	"name":"Chris Bowen",
	"size":9121
	},
	{
	"name":"David Bradbury",
	"size":5747
	},
	{
	"name":"Tony Burke",
	"size":17354
	},
	{
	"name":"Nick Champion",
	"size":3147
	},
	{
	"name":"Jason Clare",
	"size":5157
	},
	{
	"name":"Trish Crossin",
	"size":1121
	},
	{
	"name":"Kate Ellis",
	"size":26340
	},
	{
	"name":"Joel Fitzgibbon",
	"size":4433
	},
	{
	"name":"Peter Garrett",
	"size":19841
	},
	{
	"name":"Steve Georganas",
	"size":3168
	},
	{
	"name":"Steve Gibbons",
	"size":3962
	},
	{
	"name":"Julia Gillard",
	"size":324059
	},
	{
	"name":"Jill Hall",
	"size":2337
	},
	{
	"name":"Ed Husic",
	"size":5793
	},
	{
	"name":"Stephen Jones",
	"size":3369
	},
	{
	"name":"Mike Kelly",
	"size":4676
	},
	{
	"name":"Catherine King",
	"size":2836
	},
	{
	"name":"Kate Lundy",
	"size":13564
	},
	{
	"name":"Rob Mitchell",
	"size":1886
	},
	{
	"name":"Shayne Neumann",
	"size":1906
	},
	{
	"name":"Deb O'Neill",
	"size":2054
	},
	{
	"name":"Julie Owens",
	"size":529
	},
	{
	"name":"Louise Pratt",
	"size":2727
	},
	{
	"name":"Bernie Ripoll",
	"size":2599
	},
	{
	"name":"Amanda Rishworth",
	"size":2428
	},
	{
	"name":"Kevin Rudd",
	"size":1180
	},
	{
	"name":"Janelle Saffin",
	"size":944
	},
	{
	"name":"Nick Sherry",
	"size":3192
	},
	{
	"name":"Bill Shorten",
	"size":16172
	},
	{
	"name":"Ursula Stephens",
	"size":3548
	},
	{
	"name":"Craig Thomson",
	"size":5263
	},
	{
	"name":"Kelvin Thomson",
	"size":1430
	}
	]
	},
	{
	"name":"Greens",
	"children":[
	{
	"name":"Adam Bandt",
	"size":23959
	},
	{
	"name":"Bob Brown",
	"size":53944
	},
	{
	"name":"Sarah Hanson-Young",
	"size":17661
	},
	{
	"name":"Scott Ludlam",
	"size":9047
	},
	{
	"name":"Christine Milne",
	"size":13167
	},
	{
	"name":"Rachel Siewert",
	"size":3589
	}
	]
	},
	{
	"name":"Nationals",
	"children":[
	{
	"name":"George Christensen",
	"size":1512
	},
	{
	"name":"Barnaby Joyce",
	"size":261
	},
	{
	"name":"John Williams",
	"size":1033
	}
	]
	},
	{
	"name":"other",
	"children":[
	{
	"name":"Steve Fielding",
	"size":2825
	},
	{
	"name":"Robert Oakeshott",
	"size":13285
	}
	]
	}
	]
	}