Javascript 我无法让d3转换使用requestAnimationFrame

我正在准备一个测试程序来学习d3.js。然而，我似乎无法过渡到工作。我已经阅读了好几次文档，无法找出我做错了什么

我假设这与使用transition和requestAnimationFrame有关，但没有搜索词的组合为我提供有用的答案。有人能告诉我哪里出了问题吗

        (function(){
        "use strict";
        var randArray = [];

        (function randomWalk(){
            for(var i=0;i<5;i++) randArray[i] = Math.round(Math.random() * 10) % 2? randArray[i]+1 || Math.round(Math.random() * 10) : randArray[i]-1 || Math.round(Math.random() * 10);
            setTimeout(randomWalk,800);
        })();

        (function update(){
            var d3 = window.d3 || {},
                mySelection = d3.select("div#container").selectAll("div").data(randArray);
                mySelection.enter().append("div").text(function(d){return ""+d;});
                mySelection.text(function(d){return ""+d;}).transition().style('padding-bottom',function(d,i){return (d*2.5)+'em'});

            requestAnimationFrame(update);
        })();

    })();

---

这里有一个jsfiddle:

你差点就拿到了！您发布的小提琴缺少“过渡”前的一段时间：

mySelection.enter().append("div")
   .text(function(d){return ""+d;})
   .transition().style('padding-bottom',function(d,i){return (d*2.5)+'em'});

更新小提琴：

当前，页面加载时只有一个转换。如果希望每半秒钟更改一次条形图，则需要在调用update时更新randArray的值

编辑：看完你的评论后，我更新了小提琴

为了让它工作，我做了一些修改，但基本上，.enter仅在从.data向页面添加元素时使用。当我们第二次调用update时，div已经存在，并且“.enter”选项中没有任何内容。有关此选项的详细信息：

调用update时，我们应该只选择已经存在的div元素，更新它们的数据值，并使用新值重新绘制文本和填充：

d3.select("div#container")
        .selectAll("div").data(randArray)
    .text(function(d){return ""+d;})
        .transition().duration(500)
    .style('padding-bottom', function(d, i){return (d*2.5 + 'px');});   

---

我还将requestAnimationFrameupdate更改为setTimeoutupdate，1000。d3不链接动画，所以在开始另一个动画之前，通常最好确保一个动画使用“.duration500”完成

谢谢！缺少的句点是JSFIDLE中的一个类型，它出现在我的实际代码中。我要寻找的实际结果是，如果你去掉.transition调用，你会从小提琴中得到什么。RandArray每800毫秒自动更新一次，我正在尝试使条形图平滑过渡以匹配它。我已经尽可能地让他们过渡到与之相匹配的位置，但我似乎无法顺利过渡。这就是为什么我要使用转换调用。您是否建议我从graph update函数中调用randArray update？randomwalk函数只是用来模拟来自websocket的任意数据。这就是为什么我试图找到一个解决方案，其中图形和数据独立更新，但仍然有数据连接；我只是看到了缺失的句号，我的想法导致了你的问题。这是可以理解的，我的问题本来可以用更好的措辞。谢谢你的帮助。