Skip to content

@anabelle /network-D3.js secret
Created

Embed URL

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
//network
$('#network ul').each(function() {
var depth = $(this).parents('ul').length;
$(this).children().addClass('level-' + depth);
});
var w = $('#network').width();
var h = $('#network').height();
var r = 6;
var fill = d3.scale.category20();
var vis = d3.select("#network").append("svg:svg")
.attr("width", w)
.attr("height", h);
var nodes = self.nodes = d3.selectAll("#network ul li")[0],
links = self.links = nodes.slice(1).map(function(d) {
return {source: d, target: d.parentNode.parentNode};
});
var force = d3.layout.force()
.charge(-120)
.distance(3)
.nodes(nodes)
.links(links)
.size([w, h])
.start();
var link = vis.selectAll("line.link")
.data(links)
.enter().append("svg:line")
.style("stroke", "#ccc")
.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
var node = vis.selectAll(".nodeg")
.data(nodes)
.enter().append('g')
.attr("class", "nodeg")
.call(force.drag);
node.append("svg:circle")
.style("fill", function(d) {
var color = d.getAttribute("data-color");
if(color==null){
var listahija = d.childNodes[2];
if(listahija!=null){
var itemlista = listahija.childNodes[1];
if(itemlista!=null){
//console.log(itemlista);
var color = itemlista.getAttribute("data-color");
var link = itemlista.childNodes[2];
if(link!=null){
//console.log(link);
var color = link.childNodes[0].getAttribute("data-color");
}
}
}
}
return(color);
})
.style("stroke", "#fff" )
.attr("x", -8)
.attr("y", -8)
.attr("r", function(d){
if( $(d).hasClass('current_page_item') == true ){
return 8;
}else{
return 5;
}
})
.on("click", function(d, i) { window.location = d.firstChild.getAttribute("href"); });
node.append("text")
.attr("x", 12)
.attr("y", ".35em")
.attr("class", "nodetext")
.attr("class", function(d) {
if($(d).hasClass('level-1')){
return "nodewhite";
}else{
return "nodetext";
}
})
.text(function(d) { return d.firstChild.innerText });
force.on("tick", function() {
var w = $('#network').width();
var h = $('#network').height();
link.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node.attr("transform", function(d) { return "translate(" + Math.max(r, Math.min(w - r, d.x)) + "," + Math.max(r, Math.min(h - r, d.y)) + ")" });
// node.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.