Javascript 当切片不是以0角开始时,如何找到圆弧切片的质心?

Javascript 当切片不是以0角开始时,如何找到圆弧切片的质心?,javascript,geometry,pie-chart,Javascript,Geometry,Pie Chart,我试图在饼图中找到每个切片的质心。假设圆心是原点,如何计算每个切片质心的x和y坐标 我有每个切片的半径、开始角和结束角 我知道当切片的起始角度为0时,如何计算切片的质心;答案是这样的,但这假设您有切片的角度alpha,从0开始(JavaScript假设这个位置通常被认为是pi/2)。我想要这张照片中红色切片的质心的坐标: 假设红色切片的角度α为1弧度(为简单起见,startAngle=6,endAngle=5,这并不精确,但接近照片中的实际角度),图表的半径为400px。使用该公式,xbar=

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

我有每个切片的半径、开始角和结束角

我知道当切片的起始角度为0时,如何计算切片的质心;答案是这样的,但这假设您有切片的角度alpha,从0开始(JavaScript假设这个位置通常被认为是pi/2)。我想要这张照片中红色切片的质心的坐标:

假设红色切片的角度α为1弧度(为简单起见,startAngle=6,endAngle=5,这并不精确,但接近照片中的实际角度),图表的半径为400px。使用该公式,xbar=(2/3)(r/a)sin(a)=(2/3)(400/1)(.84147)=224.39226px,其位于原点右侧约225px,与质心的实际x坐标相差甚远,因为该公式假定切片的起始角为0

此外,起始点是pi/2的坐标,而不是0可能会导致问题?我不确定


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

感谢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];
}