Ancient Temple City

How to draw smooth curve through N points using javascript HTML5 canvas?

Here is the code for drawing curve from N points:

// move to the first point
ctx.moveTo(points[0].x, points[0].y);

for (i = 1; i < points.length - 2; i ++)
var xc = (points[i].x + points[i + 1].x) / 2;
var yc = (points[i].y + points[i + 1].y) / 2;
ctx.quadraticCurveTo(points[i].x, points[i].y, xc, yc);

// curve through the last two points
ctx.quadraticCurveTo(points[i].x, points[i].y, points[i+1].x,points[i+1].y);

Post a Comment



{facebook#} {twitter#} {google-plus#} {pinterest#} {youtube#} {instagram#}

Contact Form


Email *

Message *

Powered by Blogger.
Javascript DisablePlease Enable Javascript To See All Widget