Appearance
RepresentationEntity
Visual representation of an entity (model, shape, etc.)
Access via entity.representation or entity.findRepresentation(). Controls visual properties like opacity, transform, and material parameters.
Example:
javascript
var rep = entity.representation;
rep.opacity = 0.5;
rep.position = Vector3(0, 1, 0);
rep.bindMaterialParameter("baseColor", "myColor");Properties
boundingBox
- Type: BoundingBox
- Local bounding box
entity
- Type: ObjectEntity
- Parent entity
eulerAngles
- Type: Vector3
- Local rotation as euler angles (radians)
id
- Type: string
- Unique representation identifier
isEnabled
- Type: boolean
- Whether this representation is enabled/visible
mesh
- Type: Mesh
- Dynamic mesh handle for this representation. Nil unless the kind is
.dynamicMesh. Use this to write vertex/index buffers and update per-part bounds from a script. Bulk-copy semantics – one call moves many vertices, no per-element overhead.
Example:
javascript
var mesh = entity.representation.mesh;
mesh.writeVertices("position", 0, new Float32Array([
-0.25, 0.0, 0.0,
0.25, 0.0, 0.0,
0.0, 0.4, 0.0
]));
mesh.writeIndices(0, new Uint32Array([0, 1, 2]));
mesh.drawCount = 3; // sugar for updatePart(0, { indexCount: 3 })
mesh.setBounds({ min: [-1,-1,-1], max: [1,1,1] });opacity
- Type: number
- Opacity (0-1)
position
- Type: Vector3
- Local position relative to parent
rootView
- Type: UIView
- Root view of the panel content. Nil unless this representation's kind is
.userInterface.
Example:
javascript
var root = rep.rootView;
root.setProperty("isHidden", true);rotation
- Type: Rotation
- Local rotation as quaternion
scale
- Type: Vector3
- Local scale
transform
- Type: Transform
- Local transform (position, rotation, scale combined)
worldBoundingBox
- Type: BoundingBox
- World-space bounding box
worldEulerAngles
- Type: Vector3
- World-space rotation as euler angles (radians)
worldPosition
- Type: Vector3
- World-space position
worldRotation
- Type: Rotation
- World-space rotation as quaternion
worldScale
- Type: Vector3
- World-space scale
worldTransform
- Type: Transform
- World-space transform
Methods
animateBy()
javascript
animateBy(properties: Object, duration: number, options?: Object): Promise<void>Animate this representation by relative values
Parameters:
properties(Object) - Relative change propertiesduration(number) - Animation duration in secondsoptions(Object) (optional) - Animation options
Returns: Promise<void>
animateFromTo()
javascript
animateFromTo(fromProperties: Object, toProperties: Object, duration: number, options?: Object): Promise<void>Animate this representation from starting to target properties
Parameters:
fromProperties(Object) - Starting propertiestoProperties(Object) - Target propertiesduration(number) - Animation duration in secondsoptions(Object) (optional) - Animation options
Returns: Promise<void>
animateTo()
javascript
animateTo(properties: Object, duration: number, options?: Object): Promise<void>Animate this representation to target properties
Parameters:
properties(Object) - Target properties (position, rotation, scale, opacity)duration(number) - Animation duration in secondsoptions(Object) (optional) - Animation options
Returns: Promise<void>
bindMaterialParameter()
javascript
bindMaterialParameter(parameterName: string, variableId: string, options?: any): voidBind a shader material parameter to a variable for automatic updates
- scope: Variable scope - "segment" (default) or "experience" - materialId: Target specific material by ID (optional, applies to all if omitted) - slots: Target specific material slots as array of integers (optional)
Example:
javascript
// Initialize variable
scene.setVariable("tintColor", Color.red());
// Bind parameter to variable
rep.bindMaterialParameter("baseColor", "tintColor");
// Now changing the variable updates the material automatically
scene.setVariable("tintColor", Color.blue());
// With experience scope
rep.bindMaterialParameter("intensity", "globalIntensity", { scope: "experience" });
// Target specific material
rep.bindMaterialParameter("emission", "glowAmount", {
materialId: "glowMaterial",
slots: [0]
});Parameters:
parameterName(string) - Name of the material parameter (must match shader graph input)variableId(string) - ID of the variable to bindoptions(any) (optional) - Configuration object (optional)
Returns: void
createAudioStream()
javascript
createAudioStream(options?: Object): AudioStreamCreate a streaming audio player on this representation
Example:
javascript
var stream = entity.createAudioStream({ sampleRate: 24000 });
stream.append(base64Data);
stream.stop();Parameters:
options(Object) (optional) - Stream optionsoptions.sampleRate(number) (optional) - Input sample rate in Hzoptions.channels(number) (optional) - Number of channels (1 = mono, 2 = stereo)options.format(string) (optional) - Sample format: "pcm16" or "float32"
Returns: AudioStream
findChild()
javascript
findChild(name: string, recursive?: any): EntityFind a nested entity by name within the model hierarchy
Example:
javascript
var bone = rep.findChild("thumb_1");
bone.transform = hand.joints.thumbKnuckle.localTransform;Parameters:
name(string) - Entity name to findrecursive(any) (optional) - Search all descendants (default: true)
Returns: Entity
findRepresentation()
javascript
findRepresentation(query: any): RepresentationEntityFind a child representation by ID or name
Example:
javascript
var child = rep.findRepresentation({ name: "wheel" });
child.rotation = Rotation(0, Math.PI, 0);Parameters:
query(any) - Representation ID string, or object with { id: "..." } or { name: "..." }
Returns: RepresentationEntity
findView()
javascript
findView(query: any): UIViewFind a view in this representation's UI tree by ID or name
Example:
javascript
// By ID
var btn = rep.findView("save-btn");
// By name
var btn = rep.findView({ name: "Submit" });Parameters:
query(any) - View ID string, or object with{ id: "..." }or{ name: "..." }
Returns: UIView
getChildNames()
javascript
getChildNames(): Array<any>List all nested entity names (for discovery)
Example:
javascript
var names = rep.getChildNames();
console.log(names); // ["wrist", "thumb_1", "thumb_2", ...]Returns: Array<any>
off()
javascript
off(eventId: string): voidRemove an event listener from this representation
Parameters:
eventId(string) - Event ID returned from on()
Returns: void
on()
javascript
on(type: string, options?: Object | function, listener?: function): stringRegister an event listener on this representation
Example:
javascript
entity.representation.on('tap', function(event) {
console.log('This representation tapped!');
});Parameters:
type(string) - Event type: "tap", "collision", "distance", etc.options(Object | function) (optional) - Event options or callbacklistener(function) (optional) - Callback if options provided
Returns: string
once()
javascript
once(type: string, options?: Object | function, listener?: function): stringRegister a one-time event listener on this representation
Example:
javascript
entity.representation.once('tap', function(event) {
console.log('First tap on this representation!');
});Parameters:
type(string) - Event typeoptions(Object | function) (optional) - Event options or callbacklistener(function) (optional) - Callback if options provided
Returns: string
play()
javascript
play(animation: Animation): Promise<void>Play an animation on this representation
Parameters:
animation(Animation) - Animation object from Animation.to(), Animation.spin(), etc.
Returns: Promise<void>
playAudio()
javascript
playAudio(source: string, options?: Object): Promise<void>Play audio asset on this representation
Example:
javascript
await entity.playAudio('https://example.com/sound.mp3');
await entity.playAudio('assetId123', { loops: true, gain: 1.5 });Parameters:
source(string) - HTTPS URL or asset ID from projectoptions(Object) (optional) - Playback optionsoptions.gain(number) (optional) - Volume gain (0.0 to 4.0, default 1.0)options.loops(boolean) (optional) - Loop playbackoptions.inputMode(string) (optional) - "spatial", "nonSpatial", or "ambient"
Returns: Promise<void>
playAudioBuffer()
javascript
playAudioBuffer(base64: string, options?: Object): Promise<void>Play audio buffer spatially on this representation
Example:
javascript
await entity.playAudioBuffer(base64Data, { sampleRate: 24000 });Parameters:
base64(string) - Base64-encoded PCM audio dataoptions(Object) (optional) - Buffer and playback optionsoptions.sampleRate(number) (optional) - Sample rate in Hzoptions.channels(number) (optional) - Number of channels (1 = mono, 2 = stereo)options.format(string) (optional) - Sample format: "pcm16" or "float32"options.gain(number) (optional) - Volume gain (0.0 to 4.0, default 1.0)
Returns: Promise<void>
resetBlendShapeWeights()
javascript
resetBlendShapeWeights(options?: Object): voidReset all blend shape weights to zero
Parameters:
options(Object) (optional) - Options (modelName, weightSetIndex, weightSetId)
Returns: void
setBlendShapeWeights()
javascript
setBlendShapeWeights(weights: Object | number, options?: Object): voidUpdate blend shape weights on this representation (for models with morph targets/blend shapes)
Example:
javascript
// Make a character smile
representation.setBlendShapeWeights({ mouthSmileLeft: 1, mouthSmileRight: 1 });
// Animate a blink
representation.setBlendShapeWeights({ eyeBlinkLeft: 1, eyeBlinkRight: 1 });
await wait(0.15);
representation.setBlendShapeWeights({ eyeBlinkLeft: 0, eyeBlinkRight: 0 });
// Reset all weights to zero
representation.setBlendShapeWeights(0);Parameters:
weights(Object | number) - Blend shape name-value pairs, or a single number to set all weightsoptions(Object) (optional) - Optionsoptions.modelName(string) (optional) - Target specific model by name (optional)options.weightSetIndex(number) (optional) - Weight set index to updateoptions.weightSetId(string) (optional) - Weight set ID to update (alternative to index)
Returns: void
setMaterial()
javascript
setMaterial(options?: Object): Promise<void>Set material on this representation
Example:
javascript
// Apply material to all models
entity.representation.setMaterial({ id: 'redMaterial' });
// Apply to first model only
entity.representation.setMaterial({
id: 'redMaterial',
target: { type: 'firstModel' }
});
// Clear custom materials (restore originals)
entity.representation.setMaterial();Parameters:
options(Object) (optional) - Material options, omit to clear custom materialsoptions.id(string) - Material reference ID from sceneoptions.target(Object) (optional) - Target configurationoptions.target.type(string) (optional) - "allModels", "firstModel", or "selectedModels"options.target.models(Array<string>) (optional) - Model names for selectedModelsoptions.target.materialSlots(Array<number>) (optional) - Material slot indices
Returns: Promise<void>
setMaterials()
javascript
setMaterials(materials: Array<Object>): Promise<void>Set materials on this representation
Example:
javascript
// Apply multiple materials
entity.representation.setMaterials([
{ id: 'redMaterial', target: { type: 'firstModel' } },
{ id: 'blueMaterial', target: { type: 'selectedModels', models: ['body'] } }
]);
// Clear all custom materials (restore originals)
entity.representation.setMaterials([]);Parameters:
materials(Array<Object>) - Array of material optionsmaterials[].id(string) - Material reference ID from scenematerials[].target(Object) (optional) - Target configurationmaterials[].target.type(string) (optional) - "allModels", "firstModel", or "selectedModels"materials[].target.models(Array<string>) (optional) - Model names for selectedModelsmaterials[].target.materialSlots(Array<number>) (optional) - Material slot indices
Returns: Promise<void>
stopAnimations()
javascript
stopAnimations(options?: Object): Promise<void>Stop and remove animations from this representation
Parameters:
options(Object) (optional) - Optionsoptions.transitionDuration(number) (optional) - Fade out duration in seconds
Returns: Promise<void>
stopAudio()
javascript
stopAudio(): Promise<void>Stop audio playback on this representation
Example:
javascript
entity.representation.stopAudio();Returns: Promise<void>
toggle()
javascript
toggle(enabled: boolean): Promise<void>Enable or disable this representation
Parameters:
enabled(boolean) - Enable (true) or disable (false)
Returns: Promise<void>
toggleAnimations()
javascript
toggleAnimations(options?: Object): Promise<void>Toggle (pause/resume) animations on this representation
Parameters:
options(Object) (optional) - Optionsoptions.play(boolean) (optional) - Explicit play (true) or pause (false), toggles if omittedoptions.animationIds(Array<string>) (optional) - Specific animation IDs to toggle (optional, toggles all if omitted)
Returns: Promise<void>
toggleWithAnimation()
javascript
toggleWithAnimation(enable: boolean): voidToggle visibility with fade animation
Example:
javascript
rep.toggleWithAnimation(false); // Fade out
rep.toggleWithAnimation(true); // Fade inParameters:
enable(boolean) - Whether to show or hide
Returns: void
unbindMaterialParameter()
javascript
unbindMaterialParameter(parameterName: string, options?: any): voidRemove a variable binding from a material parameter
- materialId: Target specific material by ID (optional) - slots: Target specific material slots (optional)
Example:
javascript
rep.unbindMaterialParameter("baseColor");
rep.unbindMaterialParameter("emission", { materialId: "glowMaterial" });Parameters:
parameterName(string) - Name of the material parameter to unbindoptions(any) (optional) - Configuration object (optional)
Returns: void
waitUntilReady()
javascript
waitUntilReady(): Promise<void>Wait until this representation's model assets have finished loading and been attached to the scene.
Many setup calls – bindMaterialParameter, transform reads, animation triggers – depend on the model being present. On onWillAppear the representation proxy exists but the model itself usually hasn't been attached yet, and calling those methods too early silently no-ops. Await this before any model-dependent setup.
Example:
javascript
// On Cover Will Appear
var cover = scriptContext.sourceEvent.objectEntity.findRepresentation({ name: 'Cover' });
await cover.waitUntilReady();
cover.bindMaterialParameter('hueColor', 'myHue');Returns: Promise<void>
Internal API dev only
WARNING
These methods are internal implementation details and not part of the public API.
waitUntilReadyRaw() internal
javascript
waitUntilReadyRaw(callback?: any): voidInternal callback-style "wait until the model has finished loading". JS authors use the Promise-returning rep.waitUntilReady() exposed by the runtime, which wraps this. Required because JSExport methods can't directly expose async/Promise-returning signatures.
Parameters:
callback(any) (optional)
Returns: void