easy-three
Eng日本語

postprocessing.pixel

postprocessing.pixel(props : Object) : Object

props - 設定オブジェクト。
  • size (Number) : ピクセルサイズ (デフォルト : 6)。
  • normalEdge (Number) : 法線エッジの強さ (デフォルト : 0.3)。
  • depthEdge (Number) : 深度エッジの強さ (デフォルト : 0.4)。

Pixelエフェクトを追加します。
ピクセルサイズ、法線エッジの強さ、深度エッジの強さを設定できます。
戻り値は、pixel のみのオブジェクトです。
戻り値の pixel は、animate の中で呼び出すことでエフェクトを適用します。
animate の第2引数を false にしてください。

コードの例

ピクセルエフェクト

const { camera, create, animate, postprocessing } = init()

camera.position.set(0, 0, 2)

create.ambientLight()
create.directionalLight()

const cube = create.cube()

const { pixel } = postprocessing.pixel()

animate(({ delta }) => {
  cube.rotation.x += delta
  cube.rotation.y += delta
  pixel()
}, false)

時間とともにピクセルサイズを変更する

const { camera, create, animate, postprocessing } = init()

camera.position.set(0, 0, 2)

create.ambientLight()
create.directionalLight()

const cube = create.cube()

const { pixel } = postprocessing.pixel()

animate(({ delta, time }) => {
  cube.rotation.x += delta
  cube.rotation.y += delta
  pixel({
    size: ~~(6 + 5 * Math.sin(time))
  })
}, false)