three.js, TSL 노드 varying 예제

vertex shader의 결과를 fragment shader로 전달하기 위한 varying을 TSL 노드로 사용하기 위한 예제입니다. 먼저 varying으로 사용될 데이터를 정의합니다.

const colorVarying = vec3(0).toVarying(); // same as varying(vec3(0))

이 varying 데이터의 값을 재질의 vertex shader에 해당하는 positionNode에서 할당합니다.

material.positionNode = Fn(() => {
  ...

  colorVarying.assign(texture(colorTexture, colorUv).rgb)

  ...
}

varying 데이터를 재질의 다양한 fragment shader 중 하나에 해당하는 colorNode에서 사용합니다.

material.colorNode = colorVarying