add links to tree
This commit is contained in:
parent
db1fcd8425
commit
84bfde677d
1 changed files with 26 additions and 4 deletions
|
@ -13,7 +13,7 @@ var diagonal = d3.svg.diagonal()
|
||||||
.projection(function(d) { return [d.y, d.x]; });
|
.projection(function(d) { return [d.y, d.x]; });
|
||||||
|
|
||||||
var svg = d3.select("body").append("svg")
|
var svg = d3.select("body").append("svg")
|
||||||
.attr("width", width + margin.right + margin.left)
|
.attr("width", "100%")
|
||||||
.attr("height", height + margin.top + margin.bottom)
|
.attr("height", height + margin.top + margin.bottom)
|
||||||
.append("g")
|
.append("g")
|
||||||
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
||||||
|
@ -42,6 +42,16 @@ d3.json("sized_ontology.json", function(error, flare) {
|
||||||
|
|
||||||
d3.select(self.frameElement).style("height", "800px");
|
d3.select(self.frameElement).style("height", "800px");
|
||||||
|
|
||||||
|
|
||||||
|
function get_color(d) {
|
||||||
|
if (d.children || d._children) {
|
||||||
|
return '#fff'
|
||||||
|
}
|
||||||
|
if (d.size == 1) {
|
||||||
|
return "gray";
|
||||||
|
}
|
||||||
|
return "lightsteelblue";
|
||||||
|
}
|
||||||
function update(source) {
|
function update(source) {
|
||||||
|
|
||||||
// Compute the new tree layout.
|
// Compute the new tree layout.
|
||||||
|
@ -63,15 +73,22 @@ function update(source) {
|
||||||
|
|
||||||
nodeEnter.append("circle")
|
nodeEnter.append("circle")
|
||||||
.attr("r", 1e-6)
|
.attr("r", 1e-6)
|
||||||
.style("fill", function(d) { return d.children || d._children ? "#fff": "lightsteelblue"; });
|
.on("click", click)
|
||||||
|
.style("fill", get_color)
|
||||||
|
|
||||||
nodeEnter.append("text")
|
nodeEnter.append("text")
|
||||||
.attr("x", function(d) { return d.children || d._children ? -10 : 10; })
|
.attr("x", function(d) { return d.children || d._children ? -10 : 10; })
|
||||||
.attr("dy", ".35em")
|
.attr("dy", ".35em")
|
||||||
.attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
|
.attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
|
||||||
.text(function(d) { return d.name; })
|
.text(function(d) {
|
||||||
|
if (d.children || d._children || d.size == 1) {
|
||||||
|
return d.name;
|
||||||
|
}
|
||||||
|
return d.name + ' (' + d.size + ')';
|
||||||
|
})
|
||||||
.style("fill-opacity", 1e-6);
|
.style("fill-opacity", 1e-6);
|
||||||
|
|
||||||
|
|
||||||
// Transition nodes to their new position.
|
// Transition nodes to their new position.
|
||||||
var nodeUpdate = node.transition()
|
var nodeUpdate = node.transition()
|
||||||
.duration(duration)
|
.duration(duration)
|
||||||
|
@ -79,7 +96,7 @@ function update(source) {
|
||||||
|
|
||||||
nodeUpdate.select("circle")
|
nodeUpdate.select("circle")
|
||||||
.attr("r", 4.5)
|
.attr("r", 4.5)
|
||||||
.style("fill", function(d) { return d.children || d._children ? "#fff": "lightsteelblue"; });
|
.style("fill", get_color)
|
||||||
|
|
||||||
nodeUpdate.select("text")
|
nodeUpdate.select("text")
|
||||||
.style("fill-opacity", 1);
|
.style("fill-opacity", 1);
|
||||||
|
@ -138,5 +155,10 @@ function click(d) {
|
||||||
d.children = d._children;
|
d.children = d._children;
|
||||||
d._children = null;
|
d._children = null;
|
||||||
}
|
}
|
||||||
|
if (!d.children && ! d._children && d.size > 1) {
|
||||||
|
var name = d.parent.name + ': ' + d.name
|
||||||
|
document.location.href = '/clip/created/keywords=' + name
|
||||||
|
}
|
||||||
update(d);
|
update(d);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue