Varying

In order to use information in each fragment of a triangle that exists on the vertex level, this information needs to be interpolated between the vertices. The variable referred to at a specific fragment needs to be interpolated for that fragment's position based on the the value at each of the triangle's vertices and the fragment's offset from those vertices. In order for this information to be available, they need to be passed in as "varying" variables to the fragment shader. This is done by wrapping the value in call to a special function defined for each type as illustrated below.

import { float, varyingVec2, attributes } from "@hology/core/shader-nodes"

const coord: Vec2Node = varyingVec2(attributes.uv)

// coord can now be used to lookup a color from a texture on each fragment

Functions

varyingFloat(n: FloatNode): FloatNode
varyingVec2(n: Vec2Node): Vec2Node
varyingVec3(n: Vec3Node): Vec3Node
varyingVec4(n: Vec4Node): Vec4Node
varyingMat2(n: Mat2Node): Mat2Node
varyingMat3(n: Mat3Node): Mat3Node
varyingMat4(n: Mat4Node): Mat4Node

When you must use varyings

If you try to use a value that only exists in the vertex shader, you will get an error that you are referring to something undefined. This is easily fixed by wrapping it in a varying call but it is useful to know when this would happen. These are the scenarios in which you have to define a varying:

• You are referring to attributes such as position, uv, normal as this information only exist per vertex and has to be interpolated for each fragment in order to affect the color calculation.

• You have defined a value which is used both in a vertex transformation and the color.