I have done sunburst visualization sequences and want to add a link to each path.
I read a similar question d3.js, click on a link to another URL encoded with variables , and can create a link based on a variable of a specific path. (See Code below) This code can generate a suck url like " http://somelink.com/link.php?id1=CurrentNode ".
However, I want to generate a URL, for example, http://somelink.com/link.php?id1=CurrentNode&id2=ParentNode "using hierarchy information.
I am not very good at javascript, so I need help.
function createVisualization(json) {
initializeBreadcrumbTrail();
drawLegend();
d3.select("#togglelegend");
vis.append("svg:circle")
.attr("r", radius)
.style("opacity", 0);
var nodes = partition.nodes(json)
.filter(function(d) {
return (d.dx > 0.005);
});
var path = vis.data([json]).selectAll("path")
.data(nodes)
.enter().append("svg:path")
.attr("display", function(d) { return d.depth ? null : "none"; })
.attr("d", arc)
.attr("fill-rule", "evenodd")
.style("fill", function(d) { return colors[d.name]; })
.style("opacity", 1)
.on("mouseover", mouseover)
.on("click", function(d) {
var url = "http://somelink.com/link.php?id1=";
url += d.name;
$(location).attr('href', url);
window.location = url;
});
d3.select("#container").on("mouseleave", mouseleave);
totalSize = path.node().__data__.value;
};
, url sunburst.
, , .
.on("click", function(d) {
var url = "http://somelink.com/link.php";
if (d.depth== 1) {
url += "?id1=" + d.name;
}
if (d.depth== 2) {
url += "?id1=" + (d.parent ? d.parent.name : "");
url += "&id2=" + d.name;
}
if (d.depth== 3) {
url += "?id1=" + (d.parent.parent ? d.parent.parent.name : "");
url += "&id2=" + (d.parent ? d.parent.name : "");
url += "&id3=" + d.name;
}
$(location).attr('href', url);
window.location = url;
});