当切片不是从角度0开始时，如何找到弧形切片的质心？

Question

我试图在饼图中找到每个切片的质心。假设圆心是原点，如何计算每个切片质心的x和y坐标？

我有每个切片的半径，起始角度和终止角度。

我知道当切片的起始角度为0时如何计算切片的质心；答案是here.，但这假设您具有切片的角度alpha，从0开始（JavaScript假定这是通常认为是pi / 2的位置）。我想要例如这张照片中红色切片的质心的坐标：

。

假设红色切片的角度alpha为1弧度（为简单起见，startAngle = 6且endAngle = 5，这不精确，但接近照片中的实际角度），并且图表的半径为400px 。使用公式xbar =（2/3）（r / a）sin（a）=（2/3）（400/1）（。84147）= 224.39226px，相对于 right < / em>，而不是质心的实际x坐标附近，因为该公式假定切片的起始角度为0。

此外，起始点是pi / 2的坐标，而不是0可能是造成此问题的原因吗？我不确定。

如何找到质心的实际x坐标？

Answer 1

由于本·韦斯特（Ben West）的评论，我得以确定答案。您必须绕着圆startAngle弧度的圆心旋转点。

还请注意，如果使用JavaScript，则圆从pi / 2开始，并且像sin和cos函数一样沿顺时针方向而不是逆时针方向旋转，因此您必须对此加以考虑。

代码：

computeCentroid(slice, chart) {
    const startAngle = slice.startAngle - (Math.PI / 2), endAngle = slice.endAngle - (Math.PI / 2);
    const alpha = endAngle - startAngle;
    const radius = chart.radius;

    // get coordinates of centroid if startAngle = 0
    const xbar = (2 / 3) * (radius / alpha) * Math.sin(alpha);
    const ybar = (-2 / 3) * (radius / alpha) * (Math.cos(alpha) - 1);

    // rotate coordinates about (0, 0) by startAngle
    const xCoord = xbar * Math.cos(startAngle) - ybar * Math.sin(startAngle);
    const yCoord = ybar * Math.cos(startAngle) + xbar * Math.sin(startAngle);

    return [xCoord, yCoord];
}