我使用 sunburst 示例作为基础,并尝试在单击新数据时更改多行标题。点击函数如下所示:
function click(d) {
text.transition().attr("opacity", 0);
console.log(d.depth);
path.transition()
.duration(750)
.attrTween("d", arcTween(d))
.each("start", function(e, i) {
if (e.x >= d.x && e.x < (d.x + d.dx))
{
var replaceText = d3.select(this.parentNode).select("text")
replaceText.remove("tspan")
var tspan = replaceText.append("tspan")
.attr("class", "sunburst2")
.attr("x", 0)
.attr("y", 0)
.attr("text-anchor", "middle")
.text("TEST");
}
})
//each
.each("end", function(e, i) {
if (e.x >= d.x && e.x < (d.x + d.dx))
{
var arcText = d3.select(this.parentNode).select("text")
arcText.transition().duration(750)
.attr("opacity", 1)
.attr("transform", function(d) {
return "translate(" + getCentroid(d) + ")rotate(" + textRotation(d) + ")";
})
.attr("text-anchor", "middle")
}
});
//end of each
}
PS:在本例中,初始字幕应替换为“TEST”。
但它不起作用,什么也不显示。我做错了什么?提前致谢。任何意见将是有益的。