Javascript 由于施加了不正确的力，我的网格在页面加载时迅速消失？

因此，我正在网页中重新创建，以进一步测试我使用

JavaScript

的技能，我遇到了另一个障碍。我正在学习一个用

C#

编写的教程，我很久以前在学习XNA框架时使用它来重新创建它。本教程是直截了当的，大部分代码都是不言自明的，但我认为我缺乏高等数学教育，这让我再次失望

我已经成功地在300x300

canvas

中呈现了网格，没有任何问题，甚至复制了教程中的所有代码，但由于他们使用的是XNA框架库，所以他们的优势是不必编写

Vector3

类型的数学函数。我只实现了我所需要的，但我相信我的数学可能不正确，或者可能是实现错误

在我开始与它交互之前，初始网格（上面）应该是这样的，只要我禁用

网格的
更新
功能，它就会这样做。我已经完成了代码，这个问题似乎与我对向量大小的计算有关。XNA框架库总是将其称为
Length
和
LengthSquared
，但我执行的每个Google搜索都会返回计算大小的结果，如下所示：


现在，在代码中重新创建非常简单，我的
Vector3
类解释了
magnity
和
magnitysquared
，因为教程要求两者。我将我的震级计算结果与的结果进行了比较，结果是相同的：

V=（2,3,4）

|V |=5.385164807134504

最重要的是，这个计算器的URL表示我正在计算向量的长度。这让我相信，可能是我在这里的实施导致了整个事情变得疯狂。我已经在下面加入了我的代码片段，不幸的是它有点长，但我向您保证，它已经被尽可能地修剪过了


类向量3{
构造函数（x，y，z）{
这个.X=X；
这个。Y=Y；
这个。Z=Z；
}
添加（val）{
此.X+=val.X；
这个.Y+=val.Y；
这个.Z+=val.Z；
}
减去（val）{
这个.X-=val.X；
this.Y-=val.Y；
这个.Z-=val.Z；
}
多重刻度（val）{
让结果=新向量3（0,0,0）；
结果.X=此.X*val；
result.Y=此.Y*val；
结果.Z=这个.Z*val；
返回结果；
}
除以刻度（val）{
让结果=新向量3（0,0,0）；
结果.X=此.X/val；
结果.Y=此.Y/val；
结果.Z=此.Z/val；
返回结果；
}
震级（）{
if（this.X==0&&this.Y==0&&this.Z==0）
返回0；
返回Math.sqrt（Math.pow（this.X，2）+
数学.pow（this.Y，2）+
Math.pow（this.Z，2））；
}
震级平方（）{
返回Math.pow（this.magnity（），2）；
}
距离（到）{
设x=Math.pow（这是.x-to.x，2）；
设y=Math.pow（this.y-to.y，2）；
设z=Math.pow（这是.z-to.z，2）；
返回Math.sqrt（x+y+z）；
}
}
类点质量{
加速度=新矢量3（0,0,0）；
速度=新矢量3（0,0,0）；
阻尼=0.95；
建造师（职位、职位）{
这个位置=位置；
this.InverseMass=InverseMass；
}
增加阻尼（系数）{
这个。阻尼*=系数；
}
应用力（力）{
这个.加速度.加法（力.乘法标度（这个.逆质量））；
}
更新（）{
这个。速度。加（这个。加速度）；
this.Position.Add（this.Velocity）；
加速度=新矢量3（0，0，0）；
if（此速度幅值平方（）<0.001*0.001）
速度=新矢量3（0,0,0）；
速度倍率标度（阻尼）；
该阻尼=0.95；
}
}
班级春天{
构造器（起点、终点、刚度、阻尼）{
this.StartPoint=StartPoint；
this.EndPoint=端点；
这个。刚度=刚度；
这个。阻尼=阻尼；
this.TargetLength=起点位置距离（终点位置）*0.95；
}
更新（）{
设x=this.StartPoint.Position；
x、 减去（此端点位置）；
设震级=x.震级（）；
如果（震级0）