Timer Function in WebGL

Hello guys,

I need a function that works just as glutTimerFunc() in OpenGL. I read about requestAnimationFrame, but I can’t figure out how I can control the time interval between two draw() calls.

Any help is appreciated :slight_smile:

Thanks.

As far as I know you can’t do that with requestAnimationFrame. This event just trips when the browser is refreshing its page but it not guranteed to happen at a set interval.

If you need to perform an action, such as Draw(), at a constant rate or interval then I suggest using the JavaScript setInterval command.

For example, to execute Draw() every 2 seconds, you would use in your HTML code:

<SCRIPT Langauge=Javascript>
  setInterval("Draw()",2000);
</SCRIPT>

You you want to be able to disable the timer then you can use:

<SCRIPT Langauge=Javascript>
  var Timer1;
  function StartTimer()
  {
    Timer1 = setInterval("Draw()",2000);
  }
  function StopTimer()
  {
     clearInterval(Timer1);
  }
</SCRIPT>

Now you can call StartTimer to start the timer and StopTimer to stop it.

Obviously you can get more fancy and add a variable to StartTimer so that the timer can be used to execute different functions. Such as:


<SCRIPT Langauge=Javascript>
  var Timer1;
  function StartTimer(doFunc,doInterval)
  {
    Timer1 = setInterval(doFunc,doInterval);
  }
  function StopTimer()
  {
     clearInterval(Timer1);
  }
</SCRIPT>

Now you can start the timer with something like:

<SCRIPT Langauge=Javascript>
   StartTimer("Draw()",2000);
</SCRIPT>

Hope this helps.