关于弧的所有信息
An arc is a section of a circle.
弧是圆的一部分。
It has quite a lot of information:
它包含了相当多的信息:
- the center of the circle of which the arc is a part
- 圆的中心,弧是其一部分
- the radius of the circle in distance units
- 圆的半径,以距离单位表示
- a start point on the circle where the arc begins
- 圆上的起始点,弧从这里开始
- an end point on the circle where the arc end
- 圆上的一个 结束点,弧线结束的地方
- a start angle between the center and start point
- 一个起始角度,位于中心和起始点之间
- an end angle between the center and end point
- 中心和结束点之间的 结束角度
- the size of the arc in radians
- 弧的大小(以弧度为单位)
- the length of the arc in distance units
- 弧的 长度,以距离单位表示
- a large arc flag that specifies whether the arc takes up the big or small part of the circle
- 一个大弧标志,指定弧占据圆的较大部分还是较小部分
- a sweep flag that specifices whether the arc goes in the clockwise or counterclockwise direction
- 一个 扫掠标志,指定弧线是顺时针还是逆时针方向
Depending on how you're working with your arc, you may start off knowing some of this information and just need to find the rest. For example, you may know the center, radius, and start and angle angles, but need to find the size or length of the arc.
根据你如何处理弧,你可能一开始就知道其中的一些信息,只需要找到其余部分。例如,你可能知道中心、半径、起始点和角度,但需要找到弧的大小或长度。
When working with arrows, I often need to find an arc based on three points: the start, end, and some middle point. This article contains lots of math for working with arcs, most of which comes from that "three points" use-case.
在处理箭头时,我经常需要根据三点找到一个弧:起点、终点和某个中间点。本文包含了许多与弧相关的数学,大部分来自于这个“三点”用例。
I hope you find it helpful!
希望你觉得这有帮助!
A Circle from Three Points
从三个点构成的圆
Our first step is to find a circle that passes through the three points.
我们的第一步是找到一个通过这三点的圆。
function getCircleFromThreePoints(a: VecLike, b: VecLike, c: VecLike) { const u = -2 * (a.x * (b.y - c.y) - a.y * (b.x - c.x) + b.x * c.y - c.x * b.y); const center = { x: ((a.x * a.x + a.y * a.y) * (c.y - b.y) + (b.x * b.x + b.y * b.y) * (a.y - c.y) + (c.x * c.x + c.y * c.y) * (b.y - a.y)) / u, y: ((a.x * a.x + a.y * a.y) * (b.x - c.x) + (b.x * b.x + b.y * b.y) * (c.x - a.x) + (c.x * c.x + c.y * c.y) * (a.x - b.x)) / u, }; const radius = Math.hypot(center.y - a.y, cente...