javascript - How to draw a animated line appearing in canvas html5? -


i´m wondering right way draw line animation display effect in opening seconds. http://dreamteam.pl/

thanks!!

var canvas = $("#paper")[0];  var c = canvas.getcontext("2d");    var startx = 10;  var starty = 10;  var endx = 500;  var endy = 10;  var amount = 0;  setinterval(function() {    amount += 0.05; // change alter duration    if (amount > 1) amount = 1;    c.clearrect(0, 0, canvas.width, canvas.height);    c.strokestyle = "black";    c.moveto(startx, starty);    // lerp :  + (b - a) * f    c.lineto(startx + (endx - startx) * amount, starty + (endy - starty) * amount);    c.stroke();  }, 30);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <canvas id="paper" width="500" height="500"></canvas>


Comments

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

php - .htaccess mod_rewrite for dynamic url which has domain names -

Website Login Issue developed in magento -