D3中的递归/循环动画事件 [英] Recursive/recurring animation events in D3

问题描述

我正在尝试在D3中进行重复的过渡，这些过渡将无限期地重复。具体来说，我正在处理地图，但我希望背景星有时会闪烁。过渡的问题在于，它们似乎都提前运行了，因此它将尝试提前进行无限递归，并且页面将永远不会加载。我发现了一个无限的相关示例（递归d3动画问题）。我唯一的另一个想法是以某种方式使用d3计时器，但是我也不完全确定该怎么做。

I'm trying to make recurring transitions in D3 that will keep repeating indefinitely. Specifically, I'm working with a map and I want the background stars to occasionally flicker. The problem with transitions is that it appears they're all run ahead of time, so it will try to do the infinite recursion ahead of time and the page will never load. I found a related example (recursive d3 animation issue) that isn't infinite. My only other idea is to somehow use the d3 timer, but I'm not entirely sure how to go about that either. Any tips are appreciated.

推荐答案

对，您不能提前安排无数次转换。 :)但是，您可以使用在旧的过渡结束时重复安排新的过渡（或开始）。 wiki-each> transition.each 监听 end （或 start ）事件。

Right, you can’t schedule an infinite number of transitions ahead of time. :) However, you can repeatedly schedule a new transition when the old transition ends (or starts), using transition.each to listen for end (or start) events.

请查看链接的过渡示例，其中包含无限重复的动画。每当圆圈过渡开始时，它还会安排一个相同的后续过渡，使过渡可以无限期地重复。

Take a look at the chained transitions example for an infinitely-repeating animation. Whenever a circle transition starts, it also schedules an identical following transition, allowing the transition to repeat indefinitely.

或者，您可以使用setInterval 或 setTimeout 以重复创建过渡，如并发过渡示例中所示。与我链接的链状过渡示例不同，此方法不能保证链状过渡的确切同步，但是如果您只需要偶尔的背景闪烁，则可能会稍微简单一些。

Alternatively, you could use setInterval or setTimeout to create transitions repeatedly, as in the concurrent transitions example. Unlike the chained transitions example I linked, this approach won’t guarantee exact synchronization of chained transitions, but if all you want is an occasional background flicker, it might be a slightly simpler approach.

这篇关于D3中的递归/循环动画事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！