def setup
createCanvas(100, 100, WEBGL)
cam = createCamera
cam.frustum(-0.1, 0.1, -0.1, 0.1, 0.1, 200)
end
def draw
background(200)
orbitControl
normalMaterial
rotateY(-0.2)
rotateX(-0.3)
push do
translate(-15, 0, sin(frameCount / 30) * 25)
box(30)
end
push do
translate(15, 0, sin(frameCount / 30 + PI) * 25)
box(30)
end
end
[p5.js] (p5.Camera.obj).frustum
カメラに透視投影による視野(視錐台)を設定します。
| 引数名 | 内容 | 備考 | オプション | デフォルト値 |
|---|---|---|---|---|
| left | 視野(視錐台)の近い平面の左辺の位置 | ○ | -width/2 | |
| right | 視野(視錐台)の近い平面の右辺の位置 | ○ | width/2 | |
| bottom | 視野(視錐台)の近い平面の上辺の位置 | ○ | -height/2 | |
| top | 視野(視錐台)の近い平面の下辺の位置 | ○ | height/2 | |
| near | 視野(視錐台)の近い平面までの距離 | ○ | 0 | |
| far | 視野(視錐台)の遠い平面までの距離 | ○ | max(width, height) |
なし
・perspectiveメソッドと frustumメソッドはほぼ同じ機能です。
(指定する引数が異なります)。
・視野(視錐台)のイメージについては下記のサイトなどを参考にしてください。
p5.js WebGL入門 5 カメラ
6. カメラ(processing 3D入門)