Hi everyone I have problem with my sunburst
this is my function to paint my chart
function render(items){
var root = items;
var gs = svg.selectAll("g").data(partition.nodes(root));
var g = gs.enter().append("g")
.on("mouseover", mostrar)
.on("mouseout", ocultar)
.call(function(d){
total_jobs = total(items.children);
tooltip.html("<div class=title_chart>Hours</div><div class=total_job>"+ total_jobs.toLocaleString() +"</div>");
})
.on("click", click);
var path = g.append("path").style("opacity", 1);
gs.select("path")
.style("fill", function(d){
if (d.depth != 0)
return color((d.children ? d : d.parent).name);
else
return "transparent";
})
.transition().duration(500)
.attr("d", arc);
if (path.node() != null)
totalSize = path.node().__data__.value;
gs.exit().transition().duration(500).style("fill-opacity", 1e-6).remove();
}
I use the function ucultar and mostrar, when I move over the sunburst
I want to highlight the area where I am, and opacity the rest I did this with this...
function mostrar(d){
d3.selectAll("#cpu_hour path")
.style("opacity", 0.3);
var sequenceArray = getAncestors(d);
svg.selectAll("#cpu_hour path")
.filter(function(node) {
return (sequenceArray.indexOf(node) >= 0);
})
.style("opacity", 1);
tooltip.html(format_description(d));
return tooltip.transition()
.duration(50)
.style("opacity", 0.9);
}
when I am outside of my sunburst I want that again the opacity is 1, so I see all the sunburst.
And my problem is here, how to detect that I am outside the sunburst? and other thing when I move between the different part of my sunburst this function
Always call, how to avoid this ... because this call do that the opacity turn on 1 when I am inside the sunburst
function ocultar(d){
if (num_click == 1){
tooltip.html(format_description_short(d));
// hightlight()
}else{
if (num_click == 2){
tooltip.html(format_description_short(d));
//hightlight()
}else{
tooltip.html("<div class=title_chart>Cpu Hours</div><div class=total_job>"+ total_jobs.toLocaleString() +"</div>");
tooltip.transition()
.duration(50)
.style("opacity", 0.9);
var sequenceArray = getAncestors(d);
var elemento = svg.selectAll("#cpu_hour path")
.filter(function(node) {
return (sequenceArray.indexOf(node) >= 0);
})
// if (elemento[0].length == 0){
// hightlight()
// }
}
}
}
Thanks in advances!