javascript - d3.js 跳过文本转换(3 个转换中的第 2 个)

Question

改编自:http://christopheviau.com/d3_tutorial/的“绑定(bind)二维数据”部分

dataset = new Array()
dataset[0] = ['first', 'second', 'third']

d3.select("#viz")
.append("table")
.style("margin", "0 auto")
.selectAll("tr")
.data(dataset)
.enter()
.append("tr")
.selectAll("td")
.data(function(d){return d;})
.enter()
.append("td")
.style("border", "1px black solid")
.style("padding", "10px")
.text(function(d){return d;})
.style('font-size', '18pt')


.transition().delay(1000)
.text('nothing')

.transition()
.delay(1000)
.text('test');

代码也托管在这里:http://jsfiddle.net/LittleBobbyTables/vEfgu/

这会跳过文本应该说“无”的阶段，直接说“测试”。

我做错了什么吗？

Answer 1

一个接一个地调用转换不一定“链接”它们，在您的示例中，在 1000 毫秒后，第一个和第二个转换同时执行 - 因此您看不到第一个的结果。最简单的补救方法是更改​​第二次转换的延迟:

.transition().delay(2000)