Question

我现在已经盯着这一段时间而且我无法弄清楚我做错了什么。我基本上试图自己实现这个例子：http://vallandingham.me/building_a_bubble_cloud.htm

以与文章类似的方式，我有一个看起来像这样的DOM结构

<div id="d3">
    <div id="labels">
        <div class="label">Label</div>
    </div>
    <svg> << SVG-stuff >> </svg>
</div>

据我所知，在文章中，标签div使用.style（）函数定位在d3的tick函数中。正是如此：

d3.selectAll(".label")
   .style("left", function(d) { return d.x - (d.dx / 2) + "px"; })
   .style("left", function(d) { return d.x - (d.dx / 2) + "px"; })

但是：当它运行时，没有任何样式应用于元素！

我错过了什么？为什么这个例子在这个例子中起作用？

Answer 1

我很高兴自己回答这个，以防其他人对.style（）

感到困惑

上述情况中的问题是d.dx未定义，这意味着该函数不会返回任何内容。

我根本没有意识到如果是这种情况，甚至不会应用<div style="left: ; rigt: ;">。

.style()确实可以在DOM中的任何位置使用div元素，只要它的参数被定义：

.style("left", function(d) { return d.x + "px"; })

Answer 2

如果其他人将来看到这种情况，请确保您尝试应用的样式是有效的。我试图将元素的“文本锚”样式设置为“正确”，但它不会！结果是“结束”，而不是“正确”。

为什么d3.select（）。style（）不适用于<div> -elements？</div>

2 个答案: