Function
useAvatar
Here’s all properties of useAvatar hook.
const { ... } = useAvatar({
// Avatar State
avatarId: 'af3f42c9-d1d7-4e14-bd81-bf2e05fd11a3',
// Style Props
scale: 1,
style: {width: '400px', height: '400px'},
...
})
Width and height inside style props must be set to fix the size of the canvas.
Requirement
Avatar Id
avatarId
string
requiredThe identifier of the avatar.
Avatar Loaders
avatarLoaders
LoaderPlugin<any>[]
Scale
scale
number
The avatar size control.
range: [-5, 5]
Rotation
rotation
number
The avatar rotation control.
On Avatar Loaded
onAvatarLoaded
function
The callback function when the avatar is loaded.
Function
Avatar Display
avatarDisplay
ReactNode
requiredThe avatar display component.
Connect Audio Context
connectAudioContext
function
requiredThe function is connecting the audio context. (Web Audio API)
Connect Audio Element
connectAudioElement
function
The function is connecting the audio element. (HTML Audio Element)
Connect Audio Node
connectAudioNode
function
The function is connecting the audio node. (Web Audio API)
Available Triggers
Available in ThreeJSPlugin and RivePlugin.
availableTriggers
string[] | undefined
Get all available shape flow triggers. For example: [“happy”]
Example: const { availableTriggers } = useAvatar(...)
Trigger Event
Available in ThreeJSPlugin and RivePlugin.
triggerEvent
function
Trigger the avatar blendshape motion when the function clicked!