所以我确定这个问题的答案很简单,我会读它并立即开始史诗般的脸书,但此刻我已经花了一整天想知道为什么这不起作用我只是找不到问题...
我正在尝试构建一个简单的(应该是无论如何)系统围绕中心轴旋转2d点,但到目前为止我发现了两个对我来说毫无意义的问题。
问题1:分配给输入对象的正数/负数以看似随机的方式进行翻转。 问题2:旋转数学是正确的,但结果不过是。
以下是重现此问题的代码:
function doRotate(pos){
//convert angle to radians
var ang = 90 * Math.PI / 180;
//rotate points
pos.left = Math.round(pos.left * Math.cos(ang) + pos.top * Math.sin(ang));
pos.top = Math.round(pos.top * Math.cos(ang) - pos.left * Math.sin(ang));
return pos;
}
var points = {
'a':{left:32,top:32},
'b':{left:-32,top:32},
'c':{left:-32,top:-32},
'd':{left:32,top:-32}
};
for( var k in points ){
var msg = 'Start: X:'+points[k].left+' Y:'+points[k].top+'<br />';
points[k] = doRotate(points[k]);
var msg = msg+'End: X:'+points[k].left+' Y:'+points[k].top+'<br />';
document.write( '<p>'+k+':<br />'+msg+'</p>' );
}
现在你希望看到: A: 开始:X:32 Y:32 结束:X:32 Y:-32
B: 开始:X:-32 Y:32 结束:X:-32 Y:-32
C: 开始:X:-32 Y:-32 结束:X:-32 Y:32
d: 开始:X:-32 Y:32 结束:X:32 Y:32
但相反,你得到了这个:
一个: 开始:X:32 Y:32 结束:X:32 Y:32
B: 开始:X:-32 Y:-32 结束:X:32 Y:32
C: 开始:X:-32 Y:-32 结束:X:-32 Y:-32
d: 开始:X:32 Y:32 结束:X:-32 Y:-32
我已经对数学进行了三次检查,并且在2D中围绕原点旋转点是100%准确的。我甚至用PHP重新创建了这个测试,它运行得很好。我无法弄清楚为什么heck JS是a)搞砸变量赋值和b)没有得到正确的结果?
任何可以提供帮助的人都可以放心,我会以帕特里克爵士为之骄傲的面孔致敬他们的见解;)
答案 0 :(得分:2)
等一下 - 在计算pos.left
之前,您是否应该保存pos.top
,以便在计算中使用旧 pos.left
值?< / p>
答案 1 :(得分:1)
在你的“var msg = ...”语句中,你打印点[k] .left两次,永不打印点[k] .top。
答案 2 :(得分:1)
开始使用facepalm:
for( var k in points ){
var msg = 'Start: X:'+points[k].left+' Y:'+points[k].left+'<br />';
points[k] = doRotate(points[k]);
var msg = msg+'End: X:'+points[k].left+' Y:'+points[k].left+'<br />';
document.write( '<p>'+k+':<br />'+msg+'</p>' );
}
应该阅读
for( var k in points ){
var msg = 'Start: X:'+points[k].left+' Y:'+points[k].top+'<br />';
points[k] = doRotate(points[k]);
var msg = msg+'End: X:'+points[k].left+' Y:'+points[k].top+'<br />';
document.write( '<p>'+k+':<br />'+msg+'</p>' );
}
当您打印left
属性时,您正在为Y打印top
属性