Tuesday 15 June 2010

javascript - Drawing curved lines in canvas -



javascript - Drawing curved lines in canvas -

is possible draw curved lines in canvas equations? if so, how? let's have math equation y=0,5*x^2 , how print equation's graph?

i tried using beziercurveto , quadraticcurveto methods unsuccessfully.

you need populate array of points, utilize moveto , lineto draw it. this

var x1 = 0; // minimum x var x2 = 10; // maximum x var xstep = 0.1; // how smooth curve should // ctx context object // may want apply transformations coordinate scheme (var x = x1; x < x2; x += xstep) { var y = 0.5 * x * x; if (x == x1) { ctx.moveto(x, y); // first point } else { ctx.lineto(x, y); // subsequent points } } ctx.stroke();

beziercurveto, quadraticcurveto, , have fixed equation form. not sure if can used draw parabolas, arbitrary curves out of question.

javascript html5 canvas html5-canvas

No comments:

Post a Comment