bd028579
 易尊强
2/28
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
/**
* 椭圆形状
*/
import Path, { PathProps } from '../Path';
export class EllipseShape {
cx = 0
cy = 0
rx = 0
ry = 0
}
export interface EllipseProps extends PathProps {
shape?: Partial<EllipseShape>
}
class Ellipse extends Path<EllipseProps> {
shape: EllipseShape
constructor(opts?: EllipseProps) {
super(opts);
}
getDefaultShape() {
return new EllipseShape();
}
buildPath(ctx: CanvasRenderingContext2D, shape: EllipseShape) {
const k = 0.5522848;
const x = shape.cx;
const y = shape.cy;
const a = shape.rx;
const b = shape.ry;
const ox = a * k; // 水平控制点偏移量
const oy = b * k; // 垂直控制点偏移量
// 从椭圆的左端点开始顺时针绘制四条三次贝塞尔曲线
ctx.moveTo(x - a, y);
ctx.bezierCurveTo(x - a, y - oy, x - ox, y - b, x, y - b);
ctx.bezierCurveTo(x + ox, y - b, x + a, y - oy, x + a, y);
ctx.bezierCurveTo(x + a, y + oy, x + ox, y + b, x, y + b);
ctx.bezierCurveTo(x - ox, y + b, x - a, y + oy, x - a, y);
ctx.closePath();
}
}
Ellipse.prototype.type = 'ellipse';
export default Ellipse;
|
