提高JS中的Trig计算精度

如何解决提高JS中的Trig计算精度

我有一个用于JS图形的代码，该图形应该绘制三个圆，并且无论它们的半径如何，其边缘都应始终接触。

import React,{ useState,useEffect } from "react";
import "./styles.css";

export default function App() {
  //circles[0] = r1
  //circles[1] = r2
  //circles[2] = r3

  const circles = [40,30,20];
  const colours = ["green","blue","red"];


  let circle2xPos =
    2 * Math.sqrt(circles[0] * circles[1]) + circles[0]; // What Dr E has

  let r1r2 = circles[0] + circles[1];
  let r1r3 = circles[0] + circles[2];
  let r2r3 = circles[1] + circles[2];
    
   let newAngle = Math.atan2(r1r2,r1r3)
  let ycoord = Math.cos(newAngle) * r1r3
  let xcoord = Math.sin(newAngle) * r1r2 + circles[0]

  const getCircleY = index => {
    let yPos = 0;
    if (index === 2) {
      yPos = h
    }
    return yPos;
  };

  const getCircleX = (index,x) => {
    let xPos = 0;

    console.log(circles);
    for (let i = 0; i < index + 1; i++) {
      console.log(circles[i]);
      if (i === 0) {
        xPos = circles[1];
      } else if (i === 1) {
        xPos = circle2xPos;
        console.log("xPos",xPos);
      } else if (i === 2) {
        xPos = xcoord + circles[0]
      }
    }
    return xPos;
  };

  const getCircles = () => {
    return circles.map((item,index) => (
      <div
        className="circle"
        style={{
          position: "absolute",top: getCircleY(index),left: getCircleX(index,getCircleY(index)),height: 2 * item,width: 2 * item,padding: 0,margin: 0,backgroundColor: colours[index],borderRadius: "50%"
        }}
      />
    ));
  };
  return (
    <div className="App">
      <div className="circles">{getCircles()}</div>
    </div>
  );
}

工作正常-前两个始终会碰触，但下一个圆圈有时只会在正确的位置结束。

我尝试了许多不同的方法来计算第三个圆的坐标，并且我总是设法找到特定值的解决方案，但是我似乎无法一概而论，因此它可以与任何数字一起使用吗？似乎不只是将cos或sin保持在1到-1之间，因此arc函数不会返回NaN，有时触发值似乎消失了，第三个圆在错误的位置。

对于第二个圆，理想的是从（x，y）=（r1，2r1 + r3）开始（半径直接与y轴成一条直线，因此圆2堆叠在圆1的死点上），然后绕圆1的中心旋转圆2，直到它碰到圆3的边缘-我该怎么做？

解决方法

在您的圈子数组中，您有40,30，20。在这下面，您有r1r2 = circle [0] + circle [1]，所以这些看起来是半径，对吗？

假设以上正确，解决此问题的正确方法是：

在原点（0,0）处的起点1（如果需要，可以稍后转换所有点），在x轴上的起点2（r1 + r2，0）

Pt3与Pt1的距离为r1 + r2，并且应该成角度atan（r2 + r1 / r3 + r1），或者只是atan2（r2 + r1，r3 + r1）;

我认为应该可以