arcTo(): Drawing Curves using control points on Canvas

gctx.arcTo(x1,y1,x2,y2,r);
x1: First control point x coordinate
y1: First control point y coordinate
x2: Second control point x coordinate
y2: Second control point y coordinate
r : Radius of Arc or Circle ( Positive only )
var my_canvas=$('#my_canvas').get(0)
var gctx = my_canvas.getContext("2d");
gctx.beginPath();
gctx.strokeStyle = 'gray';
gctx.lineWidth = 4;
gctx.moveTo(120, 20);
gctx.lineTo(230,20);
gctx.lineTo(230,180);
gctx.stroke();
///First graph, draw the arc ///
gctx.beginPath();
gctx.moveTo(120, 20); 
gctx.strokeStyle = 'red';
gctx.lineWidth = 1;
gctx.arcTo(230,20,230,180,80);
gctx.stroke();

Subscribe

* indicates required
Subscribe to plus2net

    plus2net.com




    Post your comments , suggestion , error , requirements etc here .




    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2024 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer