在D3中使用字体时，链接未呈现

Question

我目前正在构建一个应用程序，使用这里找到的mike bostock的d3布局示例来计算github repos： http://mbostock.github.io/d3/talk/20111018/tree.html

我正在尝试渲染字体 - 真棒字体而不是SVG圈，我相信这是呈现圆圈的代码：

nodeEnter.append("svg:circle")
  .attr("r", 1e-6)
  .style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });

.

我找到了一个类似问题，当我试图使用时那个代码，它成功呈现了字体 - 真棒图标，但现在可链接文本虽然呈现，但隐藏为某种原因：

我试图操纵代码，但无法弄清楚如何获取文本节点和链接文本也呈现。

此外，我有一种感觉，这种其他代码可能会干扰我的附录并导致这个错误。这是完整的：

nodeEnter.append("svg:a")
  // make the links open in a new page
  .attr("target", "_blank")

  .attr("xlink:href", function(d) { 
    console.log('d.name -->', d.name);
    // d.data.path "" + d.name
    var url = "https://" + URLtoArr[0] + "/" + URLtoArr[1] + "/" + URLtoArr[2] + "/" + "tree/master" + "/";
    // if path is set (if it is NOT the root node), add it on to the end
    if(d.data !== undefined) {
      url += d.data.path; 
    }
    return url; 
    // https://github.com/AndyLampert/repository-file-tree-generator/blob/master/public/css/main.css
  })

  .append("svg:text")
  .text(function(d) { return d.name; })
  .attr("x", function(d) { return d.children || d._children ? -10 : 10; })
  .attr("dy", ".35em")
  .attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
  .style("fill-opacity", 1e-6);

.

最后，这是我在heroku上的当前工作应用程序： http://github-file-tree-generator.herokuapp.com/ < / p>

提前感谢！

Answer 1

文本图标正在出现，正如您可以从DOM和选择文本中讲述，但它们几乎完全透明。

.style("fill-opacity", 1e-6);==几乎不可见，虽然没有技术隐藏

一些示例建议使用几个零透明度来创建可点击的但不可见的内容（虽然您应该真正使用指针事件属性）。你必须通过意外复制它。