js来实现弹性布料

弹性布料的简介：利用js实现类似于窗帘变动的效果

效果如下图：

 

 

多个物体可以使用一根有弹性的绳子〈弹力链接）连接起来，这个绳子就相当于constraint (约束），被约束的多个刚体连接在一起之后，移动就

相互受到了牵制。

 

可撕裂布料其实就是由一些点（粒子）和点与相邻点间的连线（弹力链接

组成的物体;初始化弹力链接的规则是:非第一列有一个左弹力链接点

非第一行有一个上弹力链接点，也就是说每个粒子最多能主动初始化两条弹力链接，

一共最多能链接四个粒子。attach函数的功能则是将当前粒子所主动初始化的弹力链接

所连的粒子保存到当前粒子的constraints数组里。

  这个函数的功能有两个效果，一是让你能撕衣服与剪衣服，二是引入重力效果。
这里有几个关键点需要注意的是，po可以理解为Preious，前一时刻s坐标，如果把程序第一次运行这个粒子的undste函数称为当前时刻。那么第零次运行此粒子的updiate函数就为前一时刻。如果粒子在鼠标左键点击范围内，则坐标为:鼠标移动距离×常量再加上重力影响。否则为此时刻与上一时刻坐标差值再加上重力影响。这样你鼠标移动的越快，就越有可能撕掉衣服。
这里有一个误区，就是有人会说似乎每一次进入该函数都会给相应粒子加上重力效果导致的位移，这是事实，但是因为还有弹力，并且如果当前时刻与前一时刻的坐标相同的话，重力的效果会
小的可怜，这样就会导致人眼分辨不出粒子的运动，就像静止一样。

本次实验的启发：

给人带来真实感的东西，其内部原理不一定真实，并且内部原理的真实度与真实感不成正比。

比如这个代码的弹性链接机制，并没有遵守物理定律，并且原理简单,但只要我们肉眼分辨不出区别,那么这对于我们来说同样是真实的。

这样就会导致人眼分辨不出粒子的运动，就像静止一样。

 

源码链接：https://pan.baidu.com/s/1h58rOk6wLyFs1YC7l70Www（百度网盘）

提取码：5656

 

本博客里有参考内容，如有侵权请联系删除---------