How to use lineTo/arc/bezierCurveTo to draw an oval

Most people do not understand the knowledge points of this article "how to use lineTo/arc/bezierCurveTo to draw an oval", so the editor summarizes the following content, detailed content, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "how to use lineTo/arc/bezierCurveTo to draw an oval" article.

In canvas, it is convenient to draw a circle with arc method. Originally, a circle can also be regarded as an ellipse with equal width and height, but there is no method to draw an ellipse in canvas. We have to use other methods to simulate it.

First of all, we need to make clear what parameters are needed to draw an ellipse. Basic geometry tells us that an ellipse needs center coordinates, width, height-- or a rotation angle, but this can be left out for a while. Rotation is relatively easy.

1. Use lineTo to draw an ellipse

You read it correctly, lineTo, which is purely used to draw straight lines, can be used to draw ellipses. But he does exist, but the way it is written is a little incredible:

The copy code is as follows:

Function DrawEllipse (Canvas,O,OA,OB) {

/ / draw an ellipse, for example: var B=new Array (150150); DrawEllipse (hb,B,50,30)

With (Canvas) {

Var Xeroo [0] + OA

Var Yellowo [1]

MoveTo (XBI y)

For (var iTuno Bandi)