参考 perspective()

perspective()

在三维场景中为当前相机设置透视投影。

在透视投影中,距离相机更远的形状比距离相机更近的形状看起来更小。这种技术称为透视缩放,可以创建出逼真的三维场景。在 WebGL 模式下,默认情况下会应用这种技术。

perspective() 通过改变相机的视锥来改变相机的透视效果。视锥是相机可见的空间体积。它的形状是一个顶部被截掉的金字塔。相机放置在金字塔的顶部应该在的位置,并查看视锥的顶部(近)平面和底部(远)平面之间的所有内容。

第一个参数 fovy 是相机的垂直视野。它是一个角度,描述相机的视野有多高或多窄。例如,调用 perspective(0.5) 将相机的垂直视野设置为 0.5 弧度。默认情况下,fovy 是根据绘图的高度和相机的默认 z 坐标(800)计算的。默认 fovy 的公式是 2 * atan(height / 2 / 800)

第二个参数 aspect 是相机的宽高比。它是一个数字,描述了顶部平面的宽度与其高度的比率。例如,调用 perspective(0.5, 1.5) 将相机的视野设置为 0.5 弧度,宽高比设置为 1.5,这会使形状在正方形画布上看起来更窄。默认情况下,宽高比被设置为 width / height

第三个参数 near 是相机到近平面的距离。例如,调用 perspective(0.5, 1.5, 100) 将相机的视野设置为 0.5 弧度,宽高比设置为 1.5,并将近平面放置在相机的 100 像素处。任何距离相机少于 100 像素的形状都不会可见。默认情况下,near 被设置为 0.1 * 800,这是相机与原点之间默认距离的十分之一。

第四个参数 far 是相机到远平面的距离。例如,调用 perspective(0.5, 1.5, 100, 10000) 将相机的视野设置为 0.5 弧度,宽高比设置为 1.5,将近平面放置在相机的 100 像素处,并将远平面放置在相机的 10,000 像素处。任何距离相机超过 10,000 像素的形状都不会可见。默认情况下,far 被设置为 10 * 800,这是相机与原点之间的默认距离的十倍。

注意:perspective()只能在 WebGL 模式下使用。

示例

语法

perspective([fovy], [aspect], [near], [far])

参数

fovy
数字:

相机视锥体的垂直视场角。默认为 2 * atan(height / 2 / 800)

aspect
数字:

相机的宽高比。默认为 width / height

near
数字:

相机到近裁剪平面的距离。默认为 0.1 * 800

far
数字:

相机到远裁剪平的距离。默认为 10 * 800

Notice any errors or typos? Please let us know. Please feel free to edit src/webgl/p5.Camera.js and open a pull request!

相关参考