Classes - Revision history

EkNa: /* Class Tree */

2016-02-10T18:19:19Z

Class Tree

← Older revision		Revision as of 18:19, 10 February 2016
Line 14:		Line 14:

	{\| style="background-color: transparent;width:100%;border:0px;"		{\| style="background-color: transparent;width:100%;border:0px;"
-	\|- style="background-color: transparent;"\|	+	\|- style="background-color: transparent;"
	! Levels 1-9		! Levels 1-9
	! style="background: transparent;"\|		! style="background: transparent;"\|

EkNa: /* Class Tree */

2016-02-10T18:19:03Z

Class Tree

← Older revision		Revision as of 18:19, 10 February 2016
Line 14:		Line 14:

	{\| style="background-color: transparent;width:100%;border:0px;"		{\| style="background-color: transparent;width:100%;border:0px;"
		+	\|- style="background-color: transparent;"\|
	! Levels 1-9		! Levels 1-9
	! style="background: transparent;"\|		! style="background: transparent;"\|

EkNa: /* Class Tree */

2016-02-10T18:17:48Z

Class Tree

← Older revision		Revision as of 18:17, 10 February 2016
Line 15:		Line 15:
	{\| style="background-color: transparent;width:100%;border:0px;"		{\| style="background-color: transparent;width:100%;border:0px;"
	! Levels 1-9		! Levels 1-9
-	! style="background~~-color~~: transparent;"\|	+	! style="background: transparent;"\|
	! Levels 10-14		! Levels 10-14
	! style="background: transparent;"\|		! style="background: transparent;"\|

EkNa: /* Class Tree */

2016-02-10T18:15:31Z

Class Tree

← Older revision		Revision as of 18:15, 10 February 2016
Line 15:		Line 15:
	{\| style="background-color: transparent;width:100%;border:0px;"		{\| style="background-color: transparent;width:100%;border:0px;"
	! Levels 1-9		! Levels 1-9
-	! style="background: transparent;"\|	+	! style="background-color: transparent;"\|
	! Levels 10-14		! Levels 10-14
	! style="background: transparent;"\|		! style="background: transparent;"\|

EkNa: /* Class Tree */

2016-02-01T00:34:25Z

Class Tree

← Older revision		Revision as of 00:34, 1 February 2016
Line 13:		Line 13:
	== Class Tree ==		== Class Tree ==

-	{\| style="background-color: transparent;width:100%;"	+	{\| style="background-color: transparent;width:100%;border:0px;"
	! Levels 1-9		! Levels 1-9
	! style="background: transparent;"\|		! style="background: transparent;"\|

EkNa at 08:52, 29 August 2015

2015-08-29T08:52:52Z

← Older revision		Revision as of 08:52, 29 August 2015
Line 71:		Line 71:
	\| [[File:spion2.png\|100px\|link=Spy]]		\| [[File:spion2.png\|100px\|link=Spy]]
	\|}		\|}
-
-
-	~~<html>~~
-	~~<meta charset="utf-8">~~
-	~~<style>~~
-
-	~~.node {~~
-	~~cursor: pointer;~~
-	}
-
-	~~.node circle {~~
-	~~fill: #fff;~~
-	~~stroke: steelblue;~~
-	~~stroke-width: 1.5px;~~
-	}
-
-	~~.node text {~~
-	~~font: 10px sans-serif;~~
-	}
-
-	~~.link {~~
-	~~fill: none;~~
-	~~stroke: #ccc;~~
-	~~stroke-width: 1.5px;~~
-	}
-
-	~~</style>~~
-	~~<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>~~
-	~~<script>~~
-
-	~~var margin = {top: 20, right: 120, bottom: 20, left: 120},~~
-	~~width = 960 - margin.right - margin.left,~~
-	~~height = 800 - margin.top - margin.bottom;~~
-
-	~~var i = 0,~~
-	~~duration = 750,~~
-	~~root;~~
-
-	~~var tree = d3.layout.tree()~~
-	~~.size([height, width]);~~
-
-	~~var diagonal = d3.svg.diagonal()~~
-	~~.projection(function(d) { return [d.y, d.x]; });~~
-
-	~~var svg = d3.select("body").append("svg")~~
-	~~.attr("width", width + margin.right + margin.left)~~
-	~~.attr("height", height + margin.top + margin.bottom)~~
-	~~.append("g")~~
-	~~.attr("transform", "translate(" + margin.left + "," + margin.top + ")");~~
-
-	~~d3.json("http://bl.ocks.org/mbostock/raw/4063550/flare.json", function(error, flare) {~~
-	~~if (error) throw error;~~
-
-	~~root = flare;~~
-	~~root.x0 = height / 2;~~
-	~~root.y0 = 0;~~
-
-	~~function collapse(d) {~~
-	~~if (d.children) {~~
-	~~d._children = d.children;~~
-	~~d._children.forEach(collapse);~~
-	~~d.children = null;~~
-	}
-	}
-
-	~~root.children.forEach(collapse);~~
-	~~update(root);~~
-	~~});~~
-
-	~~d3.select(self.frameElement).style("height", "800px");~~
-
-	~~function update(source) {~~
-
-	~~// Compute the new tree layout.~~
-	~~var nodes = tree.nodes(root).reverse(),~~
-	~~links = tree.links(nodes);~~
-
-	~~// Normalize for fixed-depth.~~
-	~~nodes.forEach(function(d) { d.y = d.depth * 180; });~~
-
-	~~// Update the nodes…~~
-	~~var node = svg.selectAll("g.node")~~
-	~~.data(nodes, function(d) { return d.id \|\| (d.id = ++i); });~~
-
-	~~// Enter any new nodes at the parent's previous position.~~
-	~~var nodeEnter = node.enter().append("g")~~
-	~~.attr("class", "node")~~
-	~~.attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })~~
-	~~.on("click", click);~~
-
-	~~nodeEnter.append("circle")~~
-	~~.attr("r", 1e-6)~~
-	~~.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });~~
-
-	~~nodeEnter.append("text")~~
-	~~.attr("x", function(d) { return d.children \|\| d._children ? -10 : 10; })~~
-	~~.attr("dy", ".35em")~~
-	~~.attr("text-anchor", function(d) { return d.children \|\| d._children ? "end" : "start"; })~~
-	~~.text(function(d) { return d.name; })~~
-	~~.style("fill-opacity", 1e-6);~~
-
-	~~// Transition nodes to their new position.~~
-	~~var nodeUpdate = node.transition()~~
-	~~.duration(duration)~~
-	~~.attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; });~~
-
-	~~nodeUpdate.select("circle")~~
-	~~.attr("r", 4.5)~~
-	~~.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });~~
-
-	~~nodeUpdate.select("text")~~
-	~~.style("fill-opacity", 1);~~
-
-	~~// Transition exiting nodes to the parent's new position.~~
-	~~var nodeExit = node.exit().transition()~~
-	~~.duration(duration)~~
-	~~.attr("transform", function(d) { return "translate(" + source.y + "," + source.x + ")"; })~~
-	~~.remove();~~
-
-	~~nodeExit.select("circle")~~
-	~~.attr("r", 1e-6);~~
-
-	~~nodeExit.select("text")~~
-	~~.style("fill-opacity", 1e-6);~~
-
-	~~// Update the links…~~
-	~~var link = svg.selectAll("path.link")~~
-	~~.data(links, function(d) { return d.target.id; });~~
-
-	~~// Enter any new links at the parent's previous position.~~
-	~~link.enter().insert("path", "g")~~
-	~~.attr("class", "link")~~
-	~~.attr("d", function(d) {~~
-	~~var o = {x: source.x0, y: source.y0};~~
-	~~return diagonal({source: o, target: o});~~
-	~~});~~
-
-	~~// Transition links to their new position.~~
-	~~link.transition()~~
-	~~.duration(duration)~~
-	~~.attr("d", diagonal);~~
-
-	~~// Transition exiting nodes to the parent's new position.~~
-	~~link.exit().transition()~~
-	~~.duration(duration)~~
-	~~.attr("d", function(d) {~~
-	~~var o = {x: source.x, y: source.y};~~
-	~~return diagonal({source: o, target: o});~~
-	})
-	~~.remove();~~
-
-	~~// Stash the old positions for transition.~~
-	~~nodes.forEach(function(d) {~~
-	~~d.x0 = d.x;~~
-	~~d.y0 = d.y;~~
-	~~});~~
-	}
-
-	~~// Toggle children on click.~~
-	~~function click(d) {~~
-	~~if (d.children) {~~
-	~~d._children = d.children;~~
-	~~d.children = null;~~
-	~~} else {~~
-	~~d.children = d._children;~~
-	~~d._children = null;~~
-	}
-	~~update(d);~~
-	}
-
-	~~</script>~~
-	~~</html>~~

EkNa at 08:48, 29 August 2015

2015-08-29T08:48:47Z

← Older revision		Revision as of 08:48, 29 August 2015
Line 121:		Line 121:
	.attr("transform", "translate(" + margin.left + "," + margin.top + ")");		.attr("transform", "translate(" + margin.left + "," + margin.top + ")");

-	d3.json("/mbostock/raw/4063550/flare.json", function(error, flare) {	+	d3.json("http://bl.ocks.org/mbostock/raw/4063550/flare.json", function(error, flare) {
	if (error) throw error;		if (error) throw error;

EkNa at 08:48, 29 August 2015

2015-08-29T08:48:17Z

← Older revision		Revision as of 08:48, 29 August 2015
Line 98:		Line 98:

	</style>		</style>
		+	<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
		+	<script>
		+
		+	var margin = {top: 20, right: 120, bottom: 20, left: 120},
		+	width = 960 - margin.right - margin.left,
		+	height = 800 - margin.top - margin.bottom;
		+
		+	var i = 0,
		+	duration = 750,
		+	root;
		+
		+	var tree = d3.layout.tree()
		+	.size([height, width]);
		+
		+	var diagonal = d3.svg.diagonal()
		+	.projection(function(d) { return [d.y, d.x]; });
		+
		+	var svg = d3.select("body").append("svg")
		+	.attr("width", width + margin.right + margin.left)
		+	.attr("height", height + margin.top + margin.bottom)
		+	.append("g")
		+	.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
		+
		+	d3.json("/mbostock/raw/4063550/flare.json", function(error, flare) {
		+	if (error) throw error;
		+
		+	root = flare;
		+	root.x0 = height / 2;
		+	root.y0 = 0;
		+
		+	function collapse(d) {
		+	if (d.children) {
		+	d._children = d.children;
		+	d._children.forEach(collapse);
		+	d.children = null;
		+	}
		+	}
		+
		+	root.children.forEach(collapse);
		+	update(root);
		+	});
		+
		+	d3.select(self.frameElement).style("height", "800px");
		+
		+	function update(source) {
		+
		+	// Compute the new tree layout.
		+	var nodes = tree.nodes(root).reverse(),
		+	links = tree.links(nodes);
		+
		+	// Normalize for fixed-depth.
		+	nodes.forEach(function(d) { d.y = d.depth * 180; });
		+
		+	// Update the nodes…
		+	var node = svg.selectAll("g.node")
		+	.data(nodes, function(d) { return d.id \|\| (d.id = ++i); });
		+
		+	// Enter any new nodes at the parent's previous position.
		+	var nodeEnter = node.enter().append("g")
		+	.attr("class", "node")
		+	.attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })
		+	.on("click", click);
		+
		+	nodeEnter.append("circle")
		+	.attr("r", 1e-6)
		+	.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
		+
		+	nodeEnter.append("text")
		+	.attr("x", function(d) { return d.children \|\| d._children ? -10 : 10; })
		+	.attr("dy", ".35em")
		+	.attr("text-anchor", function(d) { return d.children \|\| d._children ? "end" : "start"; })
		+	.text(function(d) { return d.name; })
		+	.style("fill-opacity", 1e-6);
		+
		+	// Transition nodes to their new position.
		+	var nodeUpdate = node.transition()
		+	.duration(duration)
		+	.attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; });
		+
		+	nodeUpdate.select("circle")
		+	.attr("r", 4.5)
		+	.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
		+
		+	nodeUpdate.select("text")
		+	.style("fill-opacity", 1);
		+
		+	// Transition exiting nodes to the parent's new position.
		+	var nodeExit = node.exit().transition()
		+	.duration(duration)
		+	.attr("transform", function(d) { return "translate(" + source.y + "," + source.x + ")"; })
		+	.remove();
		+
		+	nodeExit.select("circle")
		+	.attr("r", 1e-6);
		+
		+	nodeExit.select("text")
		+	.style("fill-opacity", 1e-6);
		+
		+	// Update the links…
		+	var link = svg.selectAll("path.link")
		+	.data(links, function(d) { return d.target.id; });
		+
		+	// Enter any new links at the parent's previous position.
		+	link.enter().insert("path", "g")
		+	.attr("class", "link")
		+	.attr("d", function(d) {
		+	var o = {x: source.x0, y: source.y0};
		+	return diagonal({source: o, target: o});
		+	});
		+
		+	// Transition links to their new position.
		+	link.transition()
		+	.duration(duration)
		+	.attr("d", diagonal);
		+
		+	// Transition exiting nodes to the parent's new position.
		+	link.exit().transition()
		+	.duration(duration)
		+	.attr("d", function(d) {
		+	var o = {x: source.x, y: source.y};
		+	return diagonal({source: o, target: o});
		+	})
		+	.remove();
		+
		+	// Stash the old positions for transition.
		+	nodes.forEach(function(d) {
		+	d.x0 = d.x;
		+	d.y0 = d.y;
		+	});
		+	}
		+
		+	// Toggle children on click.
		+	function click(d) {
		+	if (d.children) {
		+	d._children = d.children;
		+	d.children = null;
		+	} else {
		+	d.children = d._children;
		+	d._children = null;
		+	}
		+	update(d);
		+	}
		+
		+	</script>
	</html>		</html>

EkNa at 08:47, 29 August 2015

2015-08-29T08:47:52Z

← Older revision		Revision as of 08:47, 29 August 2015
Line 73:		Line 73:


-	[html]	+	<html>
	<meta charset="utf-8">		<meta charset="utf-8">
	<style>		<style>
Line 97:		Line 97:
	}		}

-	</style>[/html]	+	</style>
		+	</html>

EkNa at 08:47, 29 August 2015

2015-08-29T08:47:28Z

← Older revision		Revision as of 08:47, 29 August 2015
Line 71:		Line 71:
	\| [[File:spion2.png\|100px\|link=Spy]]		\| [[File:spion2.png\|100px\|link=Spy]]
	\|}		\|}
		+
		+
		+	[html]
		+	<meta charset="utf-8">
		+	<style>
		+
		+	.node {
		+	cursor: pointer;
		+	}
		+
		+	.node circle {
		+	fill: #fff;
		+	stroke: steelblue;
		+	stroke-width: 1.5px;
		+	}
		+
		+	.node text {
		+	font: 10px sans-serif;
		+	}
		+
		+	.link {
		+	fill: none;
		+	stroke: #ccc;
		+	stroke-width: 1.5px;
		+	}
		+
		+	</style>[/html]