javascript - Does d3's transitions and animations use requestAnimationFrame? - Stack Overflow

admin管理员组

文章数量:1289362

I'm trying to figure out if d3's default animations use requestAnimationFrame for the callback already or if I need to do it myself. For example, I have defined a custom tween that calls a redraw function repeatedly to animation a transition from one domain to another on a graph (this is in coffeescript):

rd = @redraw # a function that takes an argument to redraw the graph
@svg.transition()
  .duration(1000)
  .tween "zoom", -> 
      interp = d3.interpolate(current_dom, target_dom)
      (t) -> rd interp(t)

In all my other calls to redraw, I schedule it with requestAnimationFrame:

scheduleRedraw: =>
  # Stop a previous request if it hasn't executed yet
  cancelAnimationFrame(@animRequest) if @animRequest       
  @animRequest = requestAnimationFrame => @redraw

However, I'm wondering if I need to do the same thing here. I have been looking at the d3 source and see that the only reference to requestAnimationFrame is in the d3 timer class. Hopefully someone with some more knowledge about d3 can help answer the following questions:

• Is the d3 timer used globally for all d3 animations and transitions?
• Do I need to use requestAnimationFrame manually here? If not, is there any case where I'd ever need to use it myself while using d3?

I'm trying to figure out if d3's default animations use requestAnimationFrame for the callback already or if I need to do it myself. For example, I have defined a custom tween that calls a redraw function repeatedly to animation a transition from one domain to another on a graph (this is in coffeescript):

rd = @redraw # a function that takes an argument to redraw the graph
@svg.transition()
  .duration(1000)
  .tween "zoom", -> 
      interp = d3.interpolate(current_dom, target_dom)
      (t) -> rd interp(t)

In all my other calls to redraw, I schedule it with requestAnimationFrame:

scheduleRedraw: =>
  # Stop a previous request if it hasn't executed yet
  cancelAnimationFrame(@animRequest) if @animRequest       
  @animRequest = requestAnimationFrame => @redraw

However, I'm wondering if I need to do the same thing here. I have been looking at the d3 source and see that the only reference to requestAnimationFrame is in the d3 timer class. Hopefully someone with some more knowledge about d3 can help answer the following questions:

• Is the d3 timer used globally for all d3 animations and transitions?
• Do I need to use requestAnimationFrame manually here? If not, is there any case where I'd ever need to use it myself while using d3?

• javascript
• animation
• d3.js
• requestanimationframe

Share Improve this question Follow asked Mar 27, 2013 at 20:32 Andrew MaoAndrew Mao 36.9k2424 gold badges148148 silver badges228228 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 12

From d3's wiki:Transitions:Timer

If your browser supports it, the timer queue will use requestAnimationFrame for fluid and efficient animation.

本文标签： javascriptDoes d339s transitions and animations use requestAnimationFrameStack Overflow