The properties passed to the component.
OptionalapiKey?: AuthClientMessage["apiKey"]Your API key. You can find it in the dashboard
OptionalarmsAnimationSmoothing?: numberDampens the arms movements.
This is a number between 0 and 1, where 0 is the default, so the motions are applied as is, and 1 effectively disables all bone movement.
OptionalbodyAnimationSmoothing?: numberDampens the body movements.
This is a number between 0 and 1, where 0 is the default, so the motions are applied as is, and 1 effectively disables all bone movement.
OptionalcameraType?: "default" | "orthographic"The type of camera the scene should be rendered with "default" is the standard perspective camera "orthographic" is an orhtographic camera
Since the two camera types work differently, things like focus have different methods of calculation.
For example, having a z-axis in an orthographic camera to control it's position and therefore the relative size of what's in view, the zoom is calculated from that value instead.
It still works with the out of box experience, but if you set focus with custom values and switch the camera type, your carefully crafted values will likely look a bit off.
If this annoys you, you can open an issue and send a pull- request in the r3f-vrm package in gitlab
OptionalclassName?: stringOptionaldebugMode?: booleanSkips auth and load checks.
Load checks are used to determine if the user has interacted with the iframe yet (among other things), so this should be turned off in prod.
Optionalenvironment?: EnvironmentsOptionalfaceAnimationSmoothing?: numberDampens the face movements.
This is a number between 0 and 1, where 0 is the default, so the motions are applied as is, and 1 effectively disables all bone movement.
Also handles face expression smoothing.
0 is the default and only applies the default transitory smoothing, meaning for example when the mouth is maxed out at "aa" for 2 seconds and then goes to "ih", the transition is already smoothed out.
1 basically holds the vowel indefinitely.
If the mouth movements feel too choppy, try setting this value to somewhere between 0.1 and 0.9
OptionalhandsAnimationSmoothing?: numberDampens the hand movements.
This is a number between 0 and 1, where 0 is the default, so the motions are applied as is, and 1 effectively disables all bone movement.
OptionalheadAnimationSmoothing?: numberDampens the head movements.
This is a number between 0 and 1, where 0 is the default, so the motions are applied as is, and 1 effectively disables all bone movement.
OptionalinitialFocus?: FocusPropsThe initial camera properties
OptionallegsAnimationSmoothing?: numberDampens the legs movements.
This is a number between 0 and 1, where 0 is the default, so the motions are applied as is, and 1 effectively disables all bone movement.
OptionallowPerformanceMode?: booleanCatch-all kind of a switch that will make things run on less powerful hardware. There are a few subtle effects like bloom and depth of field that are enabled by default, but they can be resource-intensive. On modern hardware, they run fine, but if you need to support, say, older android phones, then turning this on is a good idea.
Some effects may also cause issues on outdated hardware or software, so turning this on by default may also be a good idea in general, but your milage may vary.
Optionalraytrace?: booleanWhether to use raytracing or not.
OptionalshowControls?: booleanShows the Debug-Interface for the built-in engine, giving you access to the predefined motions, emotions and the built-in voices as a neat overlay.
Since this technology works with vrm models, and since those models only have 5 emotions by default, it can be useful for looking at how the emotions combine to show the 27 emotions that sandai supports
Optionalstyle?: React.CSSPropertiesOptionaluserId?: AuthClientMessage["userId"]Your user ID. You can find it in the dashboard
OptionalvoiceName?: VoiceNamesOptionalvrmUrl?: string
A React component that renders a 3D character using Sandai.
This component dynamically constructs the URL based on the provided props and initializes a
SandaiClientinstance to interact with the 3D character.