由于最近玩机器人，所以总涉及到一些导航地图数据的处理，需要发任务，添加导航点，发送*导航信息，少不了与canvas打交道了。

首先我们好弄清楚是什么正弦余弦定理，什么是勾股定理，角度和弧度的换算，其实我也差不多忘光光了~~

忘掉不丢人，百度走起~~，哈哈哈。。。。

下图就是点击拖动出来的东西，圆表示机器人，线表示机器的方向，目前我们已知的就是两个点的坐标，一个是圆心的坐标和鼠标移动过程的坐标，通过这连个左边我们要计算出圆的半径（这里的圆半径不是指机器人那个圆的半径，是鼠标时和拖动后产生的圆的半径）

我们先看第一个公式，求圆上任意一点的点坐标

计算两点间的距离我们就的用勾股定理了，这个距离也就是我们的圆的半径

  (a,b 为直角边，c为斜边)

好了，根据上面两条公式可以实现我们想需要的了

我们来就求个弧度，这里会用到反余弦函数哦~~

const countRadius(start:any, end: any) => {
  const [sx, sy, ex, ey] = [
    start.offsetX ? start.offsetX : start.x,
    start.offsetY ? start.offsetY : start.y,
    end.offsetX ? end.offsetX : end.x,
    end.offsetY ? end.offsetY : end.y,
  ];
  return Math.sqrt(Math.pow(ex - sx, 2) + Math.pow(ey - sy, 2));
}

const radius = countRadius(startPoint, lastPoint);

let radian = Math.acos((lastPoint.offsetX - startPoint.offsetX) / radius);

发现感觉挺完美的，我们逆时针绕一圈，弧度数出来了，但是发现上半圆和下半圆的结果好像是对称的关系，上半圆是0~π，下半圆是从π-0，我们判断下如果是下半圆我就用2π-radian就好了。

if (lastPoint.offsetY - startPoint.offsetY > 0) radian = 2*Math.PI - radian;