我正在学习 D3.js 并且对 exit() 函数有一些疑问。看下面的示例代码
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</head>
<body>
<h1>Hello, World!</h1>
<p>Test of selection of D3.js</p>
<p>Test of selection of D3.js</p>
<p>Test of selection of D3.js</p>
<p>Test of selection of D3.js</p>
<p>Test of selection of D3.js</p>
<p>Test of selection of D3.js</p>
<p>Test of selection of D3.js</p>
<script>
var p = d3.selectAll("p");
p.data([13,17,21,25])
.exit()
.remove();
p.style("font-size", function(d) { return d+"px";});
</script>
</body>
<html>
基本上,我有 7 个带有 p 选项卡的元素。该代码提供了 4 个数据项,.exit().remove() 删除了 7-4 = 3 个额外的 p 元素。之后设置 4 个元素的大小。这行得通。
但是,根据 Mike Bosock 的教程http://mbostock.github.io/d3/tutorial/circle.html,“破坏元素”部分
p.data([13,17,21,25]);
p.exit().remove();
也应该工作。但事实并非如此。
有人知道那部分有什么问题吗?非常感谢!