HTML5 using canvas drawing curves

Canvas in the HTML5 to draw a curve there are many ways, I only learned a kind, the understanding of their own to write out everyone to share, if there are errors please the Great God advice ~!

The way I learned it was Beziercurveto:

6 values to be filled in Beziercurveto are number

MoveTo (x,y)———— Specify the starting point of the curve
Beziercurveto(X1,Y1,X2,Y2,X3,Y3)
Here is an example of what I wrote:

  <canvas id= "MyCanvas "width=" 1000px "height=  ></ canvas ;         

Document. getElementById (' MyCanvas ');
Canvas. GetContext (' 2d '); 

 cxt. Beginpath () 
 cxt. LineWidth = 1; 
 CXT. moveto (110,cxt. beziercurveto (115, 155,185,155,185,< Span style= "color: #0000ff;" >130) 
 cxt. Stroke () 
 cxt. Closepath ()                      
 
 
 The effect is as follows: 

< Span style= "color: #0000ff;" >< br> to clarify the relationship between X1,y2,x2,y2,x3,y3 and X, y, I added the following code 
          

Cxt.strokestyle="Red"
Cxt.Beginpath ()
Cxt.MoveTo (110,130)
Cxt.LineTo (115,155)
Cxt.Stroke ()
Cxt.Closepath ()
Cxt.Beginpath ()
Cxt.MoveTo (115,155)
Cxt. LineTo (185,155)
Cxt. Stroke ()
Cxt. Closepath ()
Cxt. Beginpath ()
Cxt. MoveTo (185,155)
Cxt. LineTo (185,130)
Cxt. Stroke ()
CXT. Closepath ()                  


The resulting results are:

Finally, the result is that X1,y1,x2,y2 is the arc of the control curve, and the x3,y3 is the end of the curve.

 < Span style= "color: #0000ff;" >< br> 
 
                

HTML5 using canvas drawing curves