绳子模拟html5

kin*_*uri 2 javascript jquery html5 canvas

我正试图在网站上模拟物理上正确的绳索.

搜索过网络后,我的结论是我需要一个像box2d这样的物理引擎?

如果我理解正确,解决方案是将一个对象分成小段,然后加入并将这些对象组合在一起.另外,我想将物理学与浏览器结合起来.这意味着:当我快速向下滚动网站时,绳索必须以物理上正确的方式作出反应.

这可能吗?

Nor*_*ard 16

你根本不需要图书馆.您可以愉快地使用对象,组件或程序代码,以及对基本机械物理和一些2D几何(基本微积分可能有帮助)的理解.

以优化的方式进行这项工作需要更多的工作.以模块化和可重复使用的方式进行这项工作需要一些前期工程.

但制作一根绳子,并使绳子表现正常是非常简单的.

2D绳索将是一系列线段或"骨头".每根骨头都可以绕着关节弯曲.

您可以对每个骨骼施加重力或任何其他力量.
每个骨骼都有约束(它附着的其他骨骼,上方和下方).
因此,当您更新"绳索"时,您将根据之前和之后的约束更新每个骨骼.
您可以创建一个锚点 - 将绳索的顶部固定到墙上,这样无论其他骨骼如何移动,最顶部的骨骼将围绕其顶部关节旋转,但不会移动到任何位置.

要将物理应用于悬挂绳索的中间(如将其拉向中间,然后放开),您将使用反向运动学来解决对一个或两个关节的力如何影响其他连接(和约束)关节的每一个.

想想它不像蛇,更像是自行车链.
链条中的每个"链节"越短,绳索看起来就越流畅,但加工所需的时间越长.
链中的每个"链接"越长,计算变化的速度就越快,但它看起来变得越僵硬和越块.

查找"Verlet集成","运动学"("前进"/"反向"),并对旋转后的数学和沿2D矢量移动物体有一个相当不错的把握......
在那里有一点质量,如果你想要喜欢鞭子般的东西,而不仅仅是制造波浪.

其余的只是循环.

有关基本示例,请参阅以下内容:http:
//gamedev.tutsplus.com/tutorials/implementation/simulate-fabric-and-ragdolls-with-simple-verlet-integration/

玩得开心.