物体中的负数/正数自身反转?
所以我确信这个问题的答案很简单,我会阅读它并立即开始史诗般的捂脸,但此刻我花了一整天的时间想知道为什么这不起作用,而我就是可以'找不到问题...
我正在尝试构建一个简单的(应该是)系统来围绕中心轴旋转 2d 点,但到目前为止我发现了 2 个问题,这对我来说毫无意义。
问题 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>' );
}
现在您希望看到: 一个: 开始: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
但你得到的是:
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 End: X:-32 Y:-32
我已经三次检查了数学,在 2D 中围绕原点旋转点是 100% 准确的。我什至用 PHP 重新创建了这个测试,它运行得很好。我不明白的是为什么 JS a) 搞砸了变量赋值 b) 没有得出正确的结果?
任何可以提供帮助的人都可以放心,我会用帕特里克爵士引以为豪的脸向他们的洞察力致敬;)
So I'm sure the answer to this will be something simple and I'll read it and immediately commence epic facepalming, but at the moment I've spent an entire day wondering why the heck this isn't working and I just can't find the problem...
I'm trying to build a simple (supposed to be anyway) system to rotate 2d points around a central axis, but I've found 2 problems so far that make no sense to me whatsoever.
Problem 1: The positive/negative numbers assigned to the input object are being flipflopped in a seemingly random fashion.
Problem 2: The rotation math is correct, but the results are anything but.
Here's the code to reproduce this problem:
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>' );
}
Now you'd expect to see:
a:
Start: X:32 Y:32
End: X:32 Y:-32
b:
Start: X:-32 Y:32
End: X:-32 Y:-32
c:
Start: X:-32 Y:-32
End: X:-32 Y:32
d:
Start: X:-32 Y:32
End: X:32 Y:32
But instead you get this:
a:
Start: X:32 Y:32
End: X:32 Y:32
b:
Start: X:-32 Y:-32
End: X:32 Y:32
c:
Start: X:-32 Y:-32
End: X:-32 Y:-32
d:
Start: X:32 Y:32
End: X:-32 Y:-32
I've triple checked the math and that is 100% accurate to rotate points around origin in 2D. I've even recreated this test in PHP and it works perfectly. What I can't figure out is why the heck JS is a) screwing up the variable assignments and b) not coming up with the correct results?
Anyone who can help may rest assured that I will salute their insight with a facepalm Sir Patrick would be proud of ;)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
等一下 - 你不应该在计算
pos.top
之前保存pos.left
以便可以使用旧
pos该计算中的 .left
值?Wait a sec - shouldn't you save
pos.left
before you computepos.top
so that you can use the oldpos.left
value in that calculation?在你的“var msg = ...”语句中,你打印points[k].left两次,并且从不打印points[k].top。
In your "var msg = ..." statements, you're printing points[k].left twice, and never printing points[k].top.
开始捂脸:
应该显示
为 Y,当您应该打印
top
属性时,您正在打印 Y 的left
属性Commence facepalm:
should read
You're printing the
left
property for Y when you should be printing thetop
property