Wiggle API / Node

Interface: Node

Extended by

• PathLayer

Properties

enter

readonly enter: Motion

Entrance motion for this node.

---

exit

readonly exit: ExitMotion

Exit motion for this node.

---

opacity

readonly opacity: Prop

---

perspective

readonly perspective: Prop

Camera distance in pixels for the perspective of a tilt. Zero is an orthographic tilt (no foreshortening); a few hundred to a couple thousand gives a natural look, smaller being stronger.

---

rotation

readonly rotation: Prop

---

rotationX

readonly rotationX: Prop

2.5D tilt about the horizontal axis, in degrees. With perspective set, the layer foreshortens like a card tilted in space. Applies to a drawn layer (text, shape, image, video), not a group.

---

rotationY

readonly rotationY: Prop

2.5D tilt about the vertical axis, in degrees.

---

scale

readonly scale: Prop

---

x

readonly x: Prop

---

y

readonly y: Prop

Methods

anchor()

anchor(x, y): Node

Set the anchor point (fraction of the node's bounds) that sits at the position and that scale and rotation pivot around. Default 0.5, 0.5.

Parameters

x

number

y

number

Returns

Node

---

at()

at(time): Node

Set when this element's entrance begins, in seconds from scene start.

Parameters

time

Duration

Returns

Node

---

backdropBlur()

backdropBlur(radius): Node

Frosted glass: blur the content seen through this layer by radius, tinted by its fill. Applies to shapes (rect, ellipse), whose outline is the mask. A uniform layer effect.

Parameters

radius

number

Returns

Node

---

blur()

blur(radius): Node

Gaussian-blur this layer's own pixels by radius. A uniform layer effect, available on any layer, like opacity and blend.

Parameters

radius

number

Returns

Node

---

chars()

chars(): NodeGroup

Split a text node into per-character units.

Returns

NodeGroup

---

lines()

lines(): NodeGroup

Split a text node into per-line units.

Returns

NodeGroup

---

morph()

morph(targets, opts?): Node

Morph this shape's outline through a sequence of target shapes, starting at at over duration, easing each step. A target is an SVG group (loadSVG), a builder (rect, ellipse), or another layer. The outline is matched and each target is fit into this layer's box. A rectangle or ellipse layer becomes a morphing path. Text, image, and video have no single outline and are refused.

Parameters

targets

MorphTarget[]

opts?

at?

Duration

duration?

Duration

ease?

Easing

Returns

Node

---

morphTo()

morphTo(target, opts?): Node

Morph to a single target. Sugar for morph([target], opts).

Parameters

target

MorphTarget

opts?

at?

Duration

duration?

Duration

ease?

Easing

Returns

Node

---

motionBlur()

motionBlur(on?): Node

Exclude this layer from the composition's motion blur, keeping it sharp while the rest smears. motionBlur(true) or no call leaves it blurred.

Parameters

on?

boolean

Returns

Node

---

moveTo()

moveTo(x, y, opts?): Node

Animate to a position, starting at at seconds. ease is a named curve or a spring (default "inOut"). With a spring and no duration, the motion settles naturally.

Parameters

x

number

y

number

opts?

at?

Duration

duration?

Duration

ease?

Easing

Returns

Node

---

name()

name(label): Node

Name this layer so the group it belongs to can reach it with find(name), and the studio shows the name. Used to label a component's parts.

Parameters

label

string

Returns

Node

---

rotateTo()

rotateTo(degrees, opts?): Node

Animate to a rotation in degrees, starting at at seconds. Several tweens on the same property chain, each continuing from the last. See moveTo for ease.

Parameters

degrees

number

opts?

at?

Duration

duration?

Duration

ease?

Easing

Returns

Node

---

scaleTo()

scaleTo(scale, opts?): Node

Animate to a uniform scale, starting at at seconds. See moveTo for ease.

Parameters

scale

number

opts?

at?

Duration

duration?

Duration

ease?

Easing

Returns

Node

---

words()

words(): NodeGroup

Split a text node into per-word units for staggered motion.

Returns

NodeGroup