8

我在这里敲我的头。我想在诸如Zoomable Pack Layout 之类的结构中显示叶节点的工具提示。叶节点是棕色的。如果我使用工具提示的标准代码：

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 附加到叶节点，但我不知道该怎么做。

这是工具提示的小提琴： 小提琴

4

1 回答 1

9

问题其实不是代码，而是阻止叶子节点圈子接收指针事件的CSS。只需删除

circle.child {
  pointer-events: none;
}

它工作正常。完整的例子在这里。

于 2013-11-14T18:15:52.537 回答