Question

我希望在转换完成后为对象提供属性。我只是按如下方式更新图像位置：

tmp.transition().duration(1000)
                    .attr("transform", function(d) {return 'translate(' + 
                    coordinates[d].x +',' + 
                    coordinates[d].y + ')'})

一旦完成，我想给对象tmp一个属性“移动”，其值为“no”。我试过了：

tmp.transition().duration(1000)
     .attr("transform", function(d) {return 'translate(' + 
            coordinates[d].x +',' + 
            coordinates[d].y + ')'}).end('moved', 'no')

但没有成功。有小费吗？谢谢，

Answer 1

根据the documentation，您可以使用.each：

tmp.transition().duration(1000)
 .attr("transform", function(d) {return 'translate(' + 
        coordinates[d].x +',' + 
        coordinates[d].y + ')'}
 ).each('end', function() {
     d3.select(this).attr('moved', 'no');
     // or maybe also this.setAttribute('moved', 'no');
 });

Answer 2

您可以告诉javascript等待一段时间并在使用window.setTimeout后运行代码。您只需使用相同的毫秒数同步两个事件。

window.setTimeout(function(){
    //Your fake "callback" code here
}, 1000);

Answer 3

回复@ user1066286（因为我无法发表评论）：你不应该在这里使用setTimout（）！从这是不好的做法，你不能保证在超时停止时实际完成过渡。

来自d3 Transition文档：

过渡具有四阶段生命周期：

计划过渡。   过渡开始了。   转型运行。   转型结束。

这四个phaze中的每一个都是异步处理的，因此无法知道转换实际需要多长时间。它可能比用户定义的持续时间慢一点，可能会快一点。

在转换D3之后更改对象属性

3 个答案: