Question

在尝试理解d3时，我看到了行.text(String);。我无法理解String的含义。我想也许它是一个空字符串（nope），一种方法（我没有在api参考中看到它）并思考它还能做什么。

我在下面评论了它，得到了预期的结果。我不明白的是什么是String，为什么它有效。使用这一行，我的3个方形框有文本（它将在后面表示的数据的内部值），而注释掉它不会。

HTML

<div class='chart' id='chart-10'/>
<script src="http://d3js.org/d3.v3.min.js"></script>

JS：

    var w = 360;
    var h = 180;
  var svg = d3.select("#chart-10").append("svg")
      .attr("width", w)
      .attr("height", h);

  var g = svg.selectAll(".data")
      .data([50,150,250])
    .enter().append("g")
      .attr("class", "data")
      .attr("transform", function(d, i) { return "translate(" + 20 * (i + 1) + ",20)"; });

  g.append("circle")
      .attr("class", "little")
      .attr("r", 1e-6);

  g.append("rect")
      .attr("x", -10)
      .attr("y", -10)
      .attr("width", 20)
      .attr("height", 20)
      .style("fill", "lightgreen")
      .style("stroke", "green");

  g.append("text")
      .attr("dy", ".35em")
      .attr("text-anchor", "middle")
;//      .text(String);


    g.attr("transform", function(d, i) { return "translate(" + 20 * (i + 1) + ",20)"; });
    g.select("rect").style("opacity", 1);
    g.select("circle").attr("r", 1e-6);

    var t = g.transition().duration(750);
    t.attr("transform", function(d, i) { return "translate(" + d + ",90)"; });
    t.select("circle").attr("r", Math.sqrt);
    t.select("rect").style("opacity", 1e-6);

Answer 1

看起来像String constructor。根据{{3}}，正如马特指出的那样：

如果value是一个函数，则为每个选定元素（按顺序）计算函数，传递当前数据d和当前索引i，并将此上下文作为当前值DOM元素。然后使用函数的返回值来设置每个元素的文本内容。

因此，您之前要将g.data设置为[50,150,250]几行。每个数字都由String构造函数转换为String对象，并返回并用作DOM节点的文本值。

什么是String或它来自哪里？

1 个答案: