js를 사용하여 타원 모양을 그리는 방법은 무엇입니까?

Question

canvas.js 또는 다른 자바 스크립트에서 타원 모양을 그려야합니다. canvas.js에서 그릴 수 있습니까? 타원 모양을 그리고 코드를 프로그래밍하는 데 도움주세요. 감사합니다.

Answer 1

우는 소리는 williammalone's algorithm가 배울 어느

//FROM; http://www.williammalone.com/briefs/how-to-draw-ellipse-html5-canvas/ 
 

 
//Fetch element 
 
var c = document.getElementById("c"); 
 
console.log(c); 
 
//Get 2D context 
 
var context = c.getContext("2d"); 
 

 
function drawEllipse(centerX, centerY, width, height) { 
 

 
    context.beginPath(); 
 

 
    context.moveTo(centerX, centerY - height/2); // A1 
 

 
    context.bezierCurveTo(
 
    centerX + width/2, centerY - height/2, // C1 
 
    centerX + width/2, centerY + height/2, // C2 
 
    centerX, centerY + height/2); // A2 
 

 
    context.bezierCurveTo(
 
    centerX - width/2, centerY + height/2, // C3 
 
    centerX - width/2, centerY - height/2, // C4 
 
    centerX, centerY - height/2); // A1 
 

 
    context.fillStyle = "red"; 
 
    context.fill(); 
 
    context.closePath(); 
 
} 
 

 
//Fire function 
 
drawEllipse(100, 100, 100, 200)

<canvas id="c" height="200" width="200"></canvas>