displaceByLayer

Distort the child using another layer's pixels as a displacement map.

displaceByLayer(slots: {
    source: PropRef
    amount: ArgSpec
    channels: PropRef
    angle: ArgSpec
    edges: PropRef
}): GatherEffect

Import warps from shaders/std and use warps.displaceByLayer.

This one goes in effect:, not map:, because it reads a second layer. source is a prop marked compileTime: true that holds the other layer's id. amount (0–1) sets how far pixels move. channels is a prop holding 'twoAxis' (red moves x, green moves y) or 'directional' (brightness pushes along angle, in degrees). Mid-grey means no movement. edges is a prop marked compileTime: true holding 'stretch', 'transparent', 'mirror' or 'wrap'. With no source selected the child passes through unchanged.

Parameters

NameTypeNotes
slots`{
source: PropRef
amount: ArgSpec
channels: PropRef
angle: ArgSpec
edges: PropRef

}` | |

Example

effect: warps.displaceByLayer({source: p('source'), amount: p('amount'), channels: p('channelMode'), angle: p('angle'), edges: p('edges')})

Tip. An animated source layer displaces live.

See also

  • liquidDisplace — Move the child smoothly by a displacement field your own simulation produces.

Used by

DisplacementMap