Javascript D3圆包布局中嵌套圆的工具提示
我的头都撞到这里了。我希望在结构中显示叶节点的工具提示,例如。叶节是棕色的。如果我使用工具提示的标准代码:Javascript D3圆包布局中嵌套圆的工具提示,javascript,svg,d3.js,tooltip,circle-pack,Javascript,Svg,D3.js,Tooltip,Circle Pack,我的头都撞到这里了。我希望在结构中显示叶节点的工具提示,例如。叶节是棕色的。如果我使用工具提示的标准代码: vis.selectAll("circle") .data(nodes) .enter() .append("svg:circle") .attr("class", function(d) { return d.children ? "parent" : "child"; }) .attr("cx", function(d) {
vis.selectAll("circle")
.data(nodes)
.enter()
.append("svg:circle")
.attr("class", function(d) {
return d.children ? "parent" : "child";
})
.attr("cx", function(d) {
return d.x;
})
.attr("cy", function(d) {
return d.y;
})
.attr("r", function(d) {
return d.r;
})
.on("click", function(d) {
zoom(node == d ? root : d);
})
.append("svg:title")
.text("test"); \\ Browser uses this for tooltips
我在主圆上得到工具提示,但在叶节点上没有。我试过:
.append("svg:title")
.text(function(d) {
if(d.size){return 'test';}
});
…希望仅当叶节点包含的变量存在时才返回某些内容,这可能会阻止父节点显示工具提示,但我担心它所做的只是允许隐藏的工具提示,而不是静默地阻止显示任何内容
有什么想法吗?我想我要么需要堆叠svg:circles,使叶节点位于其他节点的前面,要么只将svg:titles附加到叶节点,但我不确定如何做到这一点
下面是一些工具提示:
问题实际上不是代码,而是阻止叶节点圆接收指针事件的CSS。简单删除
circle.child {
pointer-events: none;
}
而且效果很好。完整的示例。到目前为止,你能添加一个JSF的东西吗?圆圈应该已经正确堆叠了——你修改了从示例中绘制布局的方式了吗?我遇到了这里问的相同问题,尝试以与所述相同的方式添加工具提示,但我没有得到工具提示,圆圈包甚至不再显示。在此方面的任何帮助都将不胜感激!