HTML5画布 - 计算物体相对于“磁铁”的速度

我在画布中间直接放置了一个“磁铁”，并且在点击时将对象添加到画布上。然后他们被磁铁吸引。HTML5画布 - 计算物体相对于“磁铁”的速度

我在相对于彼此的对象的X和Y距离，测距和20

之间大致-20这是我使用的对象，以吸引，其工作方式计算，但越接近当力量变弱时，它应该是另一种方式，我该怎么做？

impulseX = (distanceX/100) 
impulseY = (distanceY/100)

例子：我在做什么

Distance = 20, speed = 0.05 
Distance = 10, speed = 0.1 
Distance = -20, speed = -0.05 
Distance = -10, speed = -0.1

例子：http://jsfiddle.net/qk8Wk/

感谢

来源

2013-04-22 Henryz

你能准备一个[小提琴]（http://jsfiddle.net/）吗？！ – yckart 2013-04-22 14:44:58

http://jsfiddle.net/qk8Wk/ – Henryz 2013-04-22 14:52:42

http://en.wikipedia.org/wiki/Newton%27s_law_of_universal_gravitation <= – JayC 2013-04-22 14:52:51

你的冲动应该遵循平方反比定律，即

var distance2 = distanceX * distanceX + distanceY * distanceY; 
var mag = n/distance2;

其中n是代表该领域强度的一般常数。

然后，脉冲必须按比例方向冲动的：

var theta = Math.atan2(distanceY, distanceX); 
var impulseX = mag * Math.cos(theta); 
var impulseY = mag * Math.sin(theta);

参见http://jsfiddle.net/alnitak/BH5qL/

，或者避免了三角函数（每@JayC）

var norm = Math.sqrt(distance2); 
var impulseX = mag * (distanceX/norm); 
var impulseY = mag * (distanceY/norm);

来源

2013-04-22 14:51:30 Alnitak

严格地说，使用数学三角函数是没有必要的。如果你让某个值'norm = Math.sqrt（距离X *距离X +距离Y *距离Y）'，那么'cos（theta）'在数学上等同于'distanceX/norm'，类似'distanceY/norm'为'sin（theta ）'。注意我说，“数学上”相当于浮点数，您可能会得到不同的结果。但是，随着价值通过较少的操作，我希望如果完全避免trig函数，值的质量会更好。 – JayC 2013-04-22 15:00:54

@JayC好点，尽管使用trig可能更容易遵循（最初）。 – Alnitak 2013-04-22 15:02:46

伟大的解决方案，这很好。我绝对没有想到在正确的轨道上想出我想要的东西。 – Henryz 2013-04-22 16:45:42

，但它得到的越近，力较弱，

非常符合逻辑，因为差异变小 - 所以差异/ 100也变小。

当它应该是另一种方式，我该怎么做？

使您的基础乘上的值增大，而不是更小 - f.e.

impulseX = ((20 - distanceX)/100)

来源

2013-04-22 14:46:53 CBroe

怎么样：

var distance = Math.sqrt(distanceX*distanceX + distanceY*distanceY) 
impulseX = 0.1*distanceX/distance 
impulseY = 0.1*distanceY/distance

，或者您可以使用距离^ 2：

var distance2 = distanceX*distanceX + distanceY*distanceY 
impulseX = 0.1*distanceX/distance2 
impulseY = 0.1*distanceY/distance2

来源

2013-04-22 14:47:44 Iftah

你还没有把_direction_的冲动考虑到 – Alnitak 2013-04-22 14:58:43

你说得对，我想它的一个矢量，并在最后一刻添加了“X”后缀。现在修复。 – Iftah 2013-04-22 15:02:21

嗨，我接受了另一个答案，但这种解决方案也很好，并有一个稍微不同的影响:)谢谢你的帮助 – Henryz 2013-04-22 16:46:32

HTML5画布 - 计算物体相对于“磁铁”的速度

回答

相关问题