Question

我真的不知道svg，我想选择这个元素的文本（只是这个元素）。

var text = svg.selectAll("text")
  .data(nodes)
  .enter()  
  .append("text")
  .attr("class", "label")
  .style("fill-opacity", function(d) { return d.parent === rootZC ? 1 : 0; })
  .style("display", function(d) { return d.parent === rootZC ? "inline" : "none"; })
  .text(function(d) { return d.name; });

为了更清楚，我的代码中还有其他一些文本，我想在此部分应用转换而不是上面的文本。我像这样应用我的过渡

 transition.selectAll("text")

但不知道。（工作但删除其他文本元素）那么，如何选择好我的文字？（我试过svg.text，但那不起作用）。

非常感谢您的帮助。

Answer 1

如果您想选择此文本，请在此处创建：

var text = svg.selectAll("text")
  .data(nodes)
  .enter()  
  .append("text")
  .attr("class", "label")
  .style("fill-opacity", function(d) { return d.parent === rootZC ? 1 : 0; })
  .style("display", function(d) { return d.parent === rootZC ? "inline" : "none"; })
  .text(function(d) { return d.name; });

我只想为此文本添加一个唯一的类（例如sampleClass）：

.attr('class','label sampleClass'); //adding to the class you already have

然后您可以选择所有元素：

var sampleClass = d3.selectAll('.sampleClass');

然后像这样应用翻译：

sampleClass.attr('translate', 'transform('+sampleX+','+samplyY')';

所以你的代码看起来像是：

var text = svg.selectAll("text")
      .data(nodes)
      .enter()  
      .append("text")
      .attr("class", "label sampleClass")
      .style("fill-opacity", function(d) { return d.parent === rootZC ? 1 : 0; })
      .style("display", function(d) { return d.parent === rootZC ? "inline" : "none"; })
      .text(function(d) { return d.name; });

var sampleClass = d3.selectAll('.sampleClass');

sampleClass.attr('translate', 'transform('+sampleX+','+samplyY')';

在svg / d3中选择

1 个答案: