Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #21413

Re: Draw/animation fail to stop

Show all headers | View raw

On 21.09.2013 08:33, jonas.thornvall@gmail.com wrote:
> This function starts a draw/plot sequense using a function call in a form.
>
> function initanime()
> {
>     size = 0;
>     start = 0;
>     multip = + 1;
>     run = 1;
>     refresh = setInterval(draw, 0);
> }
>
> This funtion i call to stop the draw/plot also from a form.
>
> function stopanime()
> {
>     clearInterval(refresh);
> }
>
>
> But it seem it is not at all stabile, sometimes it work sometimes not and the
> longer it run the more likely it doesn't and it totally seem to bug out when the values i plot have negative values.

When using animation with canvas you should use neither setInterval nor 
setTimeout as some suggest.

Use requestAnimationFrame and apply a condition:

   var request,
       isPlaying = true;

   function initanime() {
      size = 0;
      start = 0;
      multip = + 1;
      run = 1;

      /// start animation
      request = requestAnimationFrame(draw);
   }

   function draw() {

      ... funky animation stuff here

      if (isPlaying === true)
          request = requestAnimationFrame(draw);
   }

   function stopanime() {
      cancelAnimationFrame(request);
      isPlaying = false;
   }

A frame normally last 16.7 milliseconds (on 60 Hz monitors). You cannot 
achieve this with setTimeout/setInterval as these only takes integer 
values. requestAnimationFrame however is designed for this purpose and 
works at a lower level than the other two. You will be able to sync your 
animation to monito's VBLANK gap which remove frame "jerks".

By using a condition (here flag for demo) you can easily control the 
animtion from outside the loop.

You might need to prefix rAF in some browsers but the latest versions of 
both FireFox and Chrome has been shipped with no need for this.


-- 
Ken Fyrstenberg
Abdias Software
http://abdiassoftware.com/
(remove usenet- from address)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Draw/animation fail to stop jonas.thornvall@gmail.com - 2013-09-21 06:33 -0700
  Re: Draw/animation fail to stop "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-09-21 15:52 +0200
    Re: Draw/animation fail to stop jonas.thornvall@gmail.com - 2013-09-21 20:14 -0700
      Re: Draw/animation fail to stop Stefan Weiss <krewecherl@gmail.com> - 2013-09-22 06:47 +0200
        Re: Draw/animation fail to stop JJ <duh@nah.meh> - 2013-09-22 13:05 +0700
        Re: Draw/animation fail to stop "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2013-09-22 09:10 +0200
        Re: Draw/animation fail to stop jonas.thornvall@gmail.com - 2013-09-22 01:30 -0700
          Re: Draw/animation fail to stop jonas.thornvall@gmail.com - 2013-09-22 01:40 -0700
        Re: Draw/animation fail to stop Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-22 12:42 +0200
          Re: Draw/animation fail to stop Dr J R Stockton <reply1300@merlyn.demon.co.uk.invalid> - 2013-09-23 18:06 +0100
            Re: Draw/animation fail to stop Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-24 01:00 +0200
              Re: Draw/animation fail to stop Dr J R Stockton <reply1300@merlyn.demon.co.uk.invalid> - 2013-09-25 17:18 +0100
                Re: Draw/animation fail to stop Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-26 00:55 +0200
                Re: Draw/animation fail to stop Joao Rodrigues <groups_jr-1@yahoo.com.br> - 2013-09-25 22:33 -0300
                Re: Draw/animation fail to stop Andrew Poulos <ap_prog@hotmail.com> - 2013-09-26 15:21 +1000
                Re: Draw/animation fail to stop Dr J R Stockton <reply1300@merlyn.demon.co.uk.invalid> - 2013-09-28 19:16 +0100
      Re: Draw/animation fail to stop Christoph Michael Becker <cmbecker69@arcor.de> - 2013-09-22 14:14 +0200
        Re: Draw/animation fail to stop Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-09-22 15:06 +0200
  Re: Draw/animation fail to stop Ken <usenet-so@abdiassoftware.com> - 2013-09-22 13:44 -0500
  Re: Draw/animation fail to stop Ken <usenet-so@abdiassoftware.com> - 2013-09-22 13:50 -0500

csiph-web