three.js cannon.js物理引擎之Heightfield

今天郭先生说一说cannon.js物理引擎之Heightfield高度场，学过场论的朋友都知道物理学中把某个物理量在空间的一个区域内的分布称为场，高度场就是与高度相关的场，而cannon.js物理引擎的Heightfield的高度就是关于两个变量的函数，可以表达为HEIGHT(i,j)。当然知不知道场论不耽误我们学习Heightfield，下面就是一个由Heightfield生成的高度场，在线案例请点击博客原文。我们来说一说它的用法。

1. Heightfield的用法

说用法之前我们不妨看看他的API，文档对于它的说明是 – “高度数据以数组形式给出。这些数据点以给定的距离均匀分布”。构造函数如下。

Heightfield ( data , options )

data是一个Y值数组，将用于构建地形。options是一个配置项，有三个可配置参数。minValue是数据数组中数据点的最小值。如果未给出，将自动计算。maxValue最大值。elementSize是X方向上数据点之间的世界间距。他还有一些属性和方法请大家自行观看，我就不多说了。

高度场Heightfield本质和cannon.js一样还是一种数据的表达形式，想要把它应用到three中仍然需要对应的图形来表达（就像CANNON.Box数据需要THREE.BoxBuferGeometry几何体一样），对应的几何体就是ParametricBufferGeometry，下面我们以一个案例来实际操作一下。
2. Heightfield案例

可以点击案例来观看，下面我们直接上代码。
复制代码

initCannon() {
//这里是生成高度场的代码
var matrix = [];//创建构造高度场的数组
for (var i = 0; i < size