Shorten node labels and show additional details

doc/d3printing/GSoC/150808_labels/dev/d3-context-menu.css

+.d3-context-menu {
+	position: absolute;
+	display: none;
+	background-color: #f2f2f2;
+	border-radius: 4px;
+
+	font-family: Arial, sans-serif;
+	font-size: 14px;
+	min-width: 50px;
+	border: 1px solid #d4d4d4;
+
+	z-index:1200;
+}
+
+.d3-context-menu ul {
+	list-style-type: none;
+	margin: 4px 0px;
+	padding: 0px;
+	cursor: default;
+}
+
+.d3-context-menu ul li {
+	padding: 4px 16px;
+}
+
+.d3-context-menu ul li:hover {
+	background-color: #4677f8;
+	color: #fefefe;
+}

doc/d3printing/GSoC/150808_labels/dev/d3-context-menu.js

+d3.contextMenu = function (menu, openCallback) {
+
+	// create the div element that will hold the context menu
+	d3.selectAll('.d3-context-menu').data([1])
+		.enter()
+		.append('div')
+		.attr('class', 'd3-context-menu');
+
+	// close menu
+	d3.select('body').on('click.d3-context-menu', function() {
+		d3.select('.d3-context-menu').style('display', 'none');
+	});
+
+	// this gets executed when a contextmenu event occurs
+	return function(data, index) {	
+		var elm = this;
+
+		d3.selectAll('.d3-context-menu').html('');
+		var list = d3.selectAll('.d3-context-menu').append('ul');
+		list.selectAll('li').data(menu).enter()
+			.append('li')
+			.html(function(d) {
+				return d.title;
+			})
+			.on('click', function(d, i) {
+				d.action(elm, data, index);
+				d3.select('.d3-context-menu').style('display', 'none');
+			});
+
+		// the openCallback allows an action to fire before the menu is displayed
+		// an example usage would be closing a tooltip
+		if (openCallback) openCallback(data, index);
+
+		// display context menu
+		d3.select('.d3-context-menu')
+			.style('left', (d3.event.pageX - 2) + 'px')
+			.style('top', (d3.event.pageY - 2) + 'px')
+			.style('display', 'block');
+
+		d3.event.preventDefault();
+	};
+};

doc/d3printing/GSoC/150808_labels/dev/d3theano.css

+svg {
+	margin-left:auto;
+	margin-right:auto;
+	display:block;
+	position: fixed;
+	border: 0px solid black;
+	top:5%; left:0%; right:0% bottom=10%
+}
+
+.nodeRect {
+	stroke: black;
+	border: 3px solid black;
+}
+
+.nodeEllipse {
+	stroke: black;
+	border: 3px solid black;
+}
+
+.nodeText {
+	color: black;
+}
+
+.edge {
+	stroke-width: 3px;
+	cursor: pointer;
+	opacity: 0.4;
+}
+
+.edgeLabelRect {
+	stroke: black;
+	border: 1px solid black;
+	fill: skyblue;
+	opacity: 0.9;
+}
+
+.edgeLabelText {
+	fill: black;
+	text-anchor: start;
+}
+
+.arrowHead {
+	stroke: green;
+	stroke-width: 1px;
+}
+
+.arrowHead_n {
+	stroke: green;
+}
+
+.arrowHead_r {
+	stroke-width: 3px;
+	fill: red;
+	stroke: red;
+}
+
+.arrowHead_b {
+	stroke: dodgerblue;
+}
+
+.edgeTooltip {
+	position: absolute;
+	text-align: center;
+	vertical-align: middle;
+	min-width: 10px;
+	min-height: 10px;
+	padding: 5px;
+	background: lightsteelblue;
+	border: 1px solid black;
+	border-radius: 8px;
+	pointer-events: none;
+}
+
+.nodeTooltip {
+	position: absolute;
+	text-align: left;
+	vertical-align: middle;
+	min-width: 10px;
+	min-height: 10px;
+	padding: 5px;
+	background: lightsteelblue;
+	border: 1px solid black;
+	border-radius: 8px;
+	pointer-events: none;
+}
+
+path.hull {
+	fill: lightsteelblue;
+	fill-opacity: 0.3;
+}
\ No newline at end of file