svgcanvas/test/tests/ellipse.js
2022-07-14 20:36:39 -07:00

28 lines
927 B
JavaScript

export default function ellipse(ctx) {
//ctx.scale(2,0.5)
// Draw shapes
for (let i = 0; i < 4; i++) {
for (let j = 0; j < 4; j++) {
ctx.beginPath();
var x = 25 + j * 50; // x coordinate
var y = 25 + i * 50; // y coordinate
var radiusX = 20; // Arc radius
var radiusY = 10; // Arc radius
var rotation = Math.PI + (Math.PI * (i+j)) / 8;
var startAngle = 0; // Starting point on circle
var endAngle = Math.PI + (Math.PI * j) / 2; // End point on circle
var clockwise = i % 2 == 0 ? false : true; // clockwise or anticlockwise
ctx.ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, clockwise);
if (i > 1) {
ctx.fill();
} else {
ctx.stroke();
}
}
}
};