当前位置: 首页 > 知识库问答 >
问题:

javascript - 长方形使用rotate旋转任意角度后,怎么计算旋转后长方形在画布上的xy的轴距?

薛兴德
2024-01-05

画布宽高为1920 1080,在里面添加一个长方形,宽高为200 20,长方形在画布的坐标xy为100 100,这个长方形使用rotate旋转任意角度后,怎么计算旋转后长方形在画布上的xy的轴距

未旋转
未旋转
旋转30度
旋转30度
旋转76度
旋转76度

如何平均计算每次随机旋转后长方形距离左上角画布的Xy

算数不行,问了gpt试验之后也不正确

共有2个答案

李明贤
2024-01-05

试试这个代码

image.png

function rotatePoint(x, y, x1, y1, r, a) {    const angle = a * Math.PI / 180;    const x2 = x + r * Math.cos(angle);    const y2 = y + r * Math.sin(angle);    const dx = x1 - x;    const dy = y1 - y;    const distance = Math.sqrt(dx * dx + dy * dy);    const angle2 = Math.atan2(dy, dx) + angle;    const x3 = x + distance * Math.cos(angle2);    const y3 = y + distance * Math.sin(angle2);    return `(${x3}, ${y3})`;}const x = 0;const y = 0;const x1 = 1;const y1 = 1;const r = 1;const a = 45;console.log(rotatePoint(x, y, x1, y1, r, a));
佴保臣
2024-01-05
  const x = 200;  const y = 90;  const w = 200;  const h = 20;  const r = 80    const x1 = x + ((w / 2) - (w / 2) * Math.cos(r * Math.PI / 180))  const y1 = (y + (h / 2)) - (w / 2) * Math.sin(r * Math.PI / 180);

最后的结果是这么算出来了,各种角度也都是没有问题的

 类似资料:
  • 我正在尝试在虚拟桌面程序的API中编写脚本(javascript),以便我可以操作一些令牌(Car Wars :))。 我正在寻找答案,但似乎我正在挣扎并重新发明轮子,所以我想我会寻求帮助。我感到困惑的一个原因是程序返回基于y是向下的结果,Deg顺时针方向,这与所有trig公式想要的(逆时针方向和y是向上的)不同。 这是我可以访问的内容。矩形围绕中心、中心点 (x,y)、宽度、高度和旋转旋转。我有

  • 本文向大家介绍Unity实现绕任意轴任意角度旋转向量,包括了Unity实现绕任意轴任意角度旋转向量的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了Unity实现绕任意轴任意角度旋转向量的具体代码,供大家参考,具体内容如下 游戏中有一需求,就是一个矩形或者Cube绕着某一点旋转任意角度,现在给出下面算法。 测试用例 效果图   以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大

  • 动画outputRotate Out Up LeftRotate InRotate Out Up RightRotate Out Up LeftRotate Out Up RightRotate OutRotate Out Up LeftRotate Out Up RightRotate Out Up LeftRotate Out Up Right

  • 我的任务是在画布上绘制许多矩形,但所有矩形都有一个旋转角度,它们必须在画布上旋转。我在寻找这个问题的解决方案时遇到的许多建议都指出了绘制一个矩形并旋转画布的方法(canvas.rotate(angle)),但它会旋转所有画布,并且只能使用一个矩形。在画布上绘制许多旋转矩形的最佳方法是什么?我想画矩形(单色,带颜料),但不是位图,因为时间效率和内存。 目前我主要的方法是创建一堆画布,在每个画布上绘制

  • 下面我有这个程序。我想让程序在同一点旋转形状,也旋转矩形不止一次。但是,程序只旋转矩形一次,并将旋转后的形状放在框架的另一个点上。我真的需要帮助。谢谢!!!!*

  • 我刚开始使用JavaFX,有一个问题。在我的项目中,我想使用旋转矩形。但矩形只围绕其中心旋转,我希望它围绕其左上角旋转。 就像这张照片(从这里开始): 下面是我的项目中的一些代码: 在这种情况下,如果按下箭头键,矩形会旋转。