Raphael.js 在变换后获取矩形坐标答案

【问题标题】：Raphael.js get rectangle coords after transformRaphael.js 在变换后获取矩形坐标
【发布时间】：2013-11-05 08:52:31
【问题描述】：

我正在用 javascript 和 Raphael.js 制作一个小游戏（我对它还很陌生），而且我基本上正在制作一个炮塔，只是一个围绕它有一个矩形旋转的圆圈。而且效果很好，花花公子！转换代码是：

this.self = this.self.animate({ transform : this.transform }, 250);

但是，我需要在为矩形设置动画后找到它的坐标，但 getBBox() 一直得到相同的坐标。有没有人有什么建议？转换的视觉图片将是：

所以我需要转换后的炮塔坐标。我需要找到炮塔的前部，这样我才能知道子弹需要从哪里出来！任何建议将不胜感激！

【问题讨论】：

【解决方案1】：

通过使用旋转数，将帮助您找到坐标。假设旋转角度为 q = 45 度。

这意味着y 改变了asin(q) 并且x 改变了a-acos(q)。

编辑

注意所有情况。在这种特殊情况下，两个坐标都减小了，但是如果您转向东南，则y 增加，x 减少。或者如果是西北：y 和 x 减少。

【讨论】：

所以公式是 y= a*sin(a) 和 x=a-a(cos(a)) ?
请注意，角度以弧度为单位。所以对于 45 度，它应该是sin(Math.PI/4)。但一般来说，如果您不需要向人类展示，最好只以弧度测量角度。习惯2*PI === 360 degrees。
如果说，我知道它的 30 度所以我只做 sin(30)，它还能工作吗？

【解决方案2】：

变换只是一种视觉效果，它不会影响坐标。你知道炮塔的宽度，你知道旋转角度。使用 sin & cos 计算新坐标。

X = Math.cos((i * Math.PI) / 180) * R + x; Y = Math.sin((i * Math.PI) / 180) * R + y;

i - 角度 R - 炮塔宽度 x 和 y - 炮塔偏移

【讨论】：