Class: Options

Defined in: src/core/Options.ts:64

A central configuration class for the entire XR Blocks system. It aggregates all settings and provides chainable methods for enabling common features.

Constructors

Constructor

new Options(options?): Options

Defined in: src/core/Options.ts:177

Constructs the Options object by merging default values with provided custom options.

Parameters

options?

A custom options object to override the defaults.

ai?

{ enabled?: boolean; gemini?: { apiKey?: string; config?: { }; enabled?: boolean; keyValid?: boolean; liveModel?: string; model?: string; urlParam?: string; }; globalUrlParams?: { key?: string; }; model?: AIModel; openai?: { apiKey?: string; enabled?: boolean; model?: string; urlParam?: string; }; } = ...

ai.enabled?

boolean = false

ai.gemini?

{ apiKey?: string; config?: { }; enabled?: boolean; keyValid?: boolean; liveModel?: string; model?: string; urlParam?: string; } = ...

ai.gemini.apiKey?

string = ''

ai.gemini.config?

{ } = {}

ai.gemini.enabled?

boolean = false

ai.gemini.keyValid?

boolean = false

ai.gemini.liveModel?

string = GEMINI_DEFAULT_LIVE_MODEL

ai.gemini.model?

string = GEMINI_DEFAULT_FLASH_MODEL

ai.gemini.urlParam?

string = 'geminiKey'

ai.globalUrlParams?

{ key?: string; } = ...

ai.globalUrlParams.key?

string = 'key'

ai.model?

AIModel = 'gemini'

ai.openai?

{ apiKey?: string; enabled?: boolean; model?: string; urlParam?: string; } = ...

ai.openai.apiKey?

string = ''

ai.openai.enabled?

boolean = false

ai.openai.model?

string = 'gpt-4.1'

ai.openai.urlParam?

string = 'openaiKey'

antialias?

boolean = true

Whether to use antialiasing.

camera?

{ far?: number; near?: number; } = ...

camera.far?

number = 500

camera.near?

number = 0.01

canvas?

{ }

Canvas element to use for rendering. If not defined, a new element will be added to document body.

controllers?

{ debug?: boolean; enabled?: boolean; enabledMouse?: boolean; performRaycastOnUpdate?: boolean; visualization?: boolean; visualizeRays?: boolean; } = ...

controllers.debug?

boolean = false

Whether to enable debugging features for controllers.

controllers.enabled?

boolean = true

Whether controller input is enabled.

controllers.enabledMouse?

boolean = true

Whether mouse input should act as a controller on desktop.

controllers.performRaycastOnUpdate?

boolean = true

Whether to perform raycast on update. This is needed for the reticle to work properly.

controllers.visualization?

boolean = false

Whether to show controller models.

controllers.visualizeRays?

boolean = false

Whether to show the ray lines extending from the controllers.

debugging?

boolean = false

Global flag for enabling various debugging features.

depth?

{ debugging?: boolean; depthMesh?: { colliderUpdateFps?: number; depthFullResolution?: number; depthMeshUpdateFps?: number; enabled?: boolean; ignoreEdgePixels?: number; opacity?: number; patchHoles?: boolean; patchHolesUpper?: boolean; renderShadow?: boolean; shadowOpacity?: number; showDebugTexture?: boolean; updateFullResolutionGeometry?: boolean; updateVertexNormals?: boolean; useDepthTexture?: boolean; useDownsampledGeometry?: boolean; useDualCollider?: boolean; }; depthTexture?: { applyGaussianBlur?: boolean; applyKawaseBlur?: boolean; constantKernel?: boolean; enabled?: boolean; }; depthTypeRequest?: readonly (undefined | XRDepthType)[]; enabled?: boolean; matchDepthView?: boolean; occlusion?: { enabled?: boolean; }; useFloat32?: boolean; } = ...

depth.debugging?

boolean = false

depth.depthMesh?

{ colliderUpdateFps?: number; depthFullResolution?: number; depthMeshUpdateFps?: number; enabled?: boolean; ignoreEdgePixels?: number; opacity?: number; patchHoles?: boolean; patchHolesUpper?: boolean; renderShadow?: boolean; shadowOpacity?: number; showDebugTexture?: boolean; updateFullResolutionGeometry?: boolean; updateVertexNormals?: boolean; useDepthTexture?: boolean; useDownsampledGeometry?: boolean; useDualCollider?: boolean; } = ...

depth.depthMesh.colliderUpdateFps?

number = 5

depth.depthMesh.depthFullResolution?

number = 160

depth.depthMesh.depthMeshUpdateFps?

number = 0

FPS cap for depth mesh geometry updates. 0 = update every frame.

depth.depthMesh.enabled?

boolean = false

depth.depthMesh.ignoreEdgePixels?

number = 3

depth.depthMesh.opacity?

number = 1.0

depth.depthMesh.patchHoles?

boolean = false

depth.depthMesh.patchHolesUpper?

boolean = false

depth.depthMesh.renderShadow?

boolean = false

depth.depthMesh.shadowOpacity?

number = 0.25

depth.depthMesh.showDebugTexture?

boolean = false

depth.depthMesh.updateFullResolutionGeometry?

boolean = false

depth.depthMesh.updateVertexNormals?

boolean = false

depth.depthMesh.useDepthTexture?

boolean = false

depth.depthMesh.useDownsampledGeometry?

boolean = true

depth.depthMesh.useDualCollider?

boolean = false

depth.depthTexture?

{ applyGaussianBlur?: boolean; applyKawaseBlur?: boolean; constantKernel?: boolean; enabled?: boolean; } = ...

depth.depthTexture.applyGaussianBlur?

boolean = false

depth.depthTexture.applyKawaseBlur?

boolean = false

depth.depthTexture.constantKernel?

boolean = false

depth.depthTexture.enabled?

boolean = false

depth.depthTypeRequest?

readonly (undefined | XRDepthType)[] = ...

depth.enabled?

boolean = false

depth.matchDepthView?

boolean = true

depth.occlusion?

{ enabled?: boolean; } = ...

depth.occlusion.enabled?

boolean = false

depth.useFloat32?

boolean = true

deviceCamera?

{ cameraLabel?: string; enabled?: boolean; rgbToDepthParams?: { k1?: number; k2?: number; k3?: number; p1?: number; p2?: number; scale?: number; scaleX?: number; scaleY?: number; translateU?: number; translateV?: number; xc?: number; yc?: number; }; videoConstraints?: { }; willCaptureFrequently?: boolean; } = ...

deviceCamera.cameraLabel?

string

deviceCamera.enabled?

boolean = false

deviceCamera.rgbToDepthParams?

{ k1?: number; k2?: number; k3?: number; p1?: number; p2?: number; scale?: number; scaleX?: number; scaleY?: number; translateU?: number; translateV?: number; xc?: number; yc?: number; } = ...

Parameters for RGB to depth UV mapping given different aspect ratios.

deviceCamera.rgbToDepthParams.k1?

number

deviceCamera.rgbToDepthParams.k2?

number

deviceCamera.rgbToDepthParams.k3?

number

deviceCamera.rgbToDepthParams.p1?

number

deviceCamera.rgbToDepthParams.p2?

number

deviceCamera.rgbToDepthParams.scale?

number

deviceCamera.rgbToDepthParams.scaleX?

number

deviceCamera.rgbToDepthParams.scaleY?

number

deviceCamera.rgbToDepthParams.translateU?

number

deviceCamera.rgbToDepthParams.translateV?

number

deviceCamera.rgbToDepthParams.xc?

number

deviceCamera.rgbToDepthParams.yc?

number

deviceCamera.videoConstraints?

{ }

Constraints for getUserMedia. This will guide the initial camera selection.

deviceCamera.willCaptureFrequently?

boolean = false

Hint for performance optimization on frequent captures.

enableAI?

() => Options

enableCamera?

(facingMode) => Options

enableControllers?

() => Options

enableDepth?

() => Options

enableGestures?

() => Options

enableHandRays?

() => Options

enableHands?

() => Options

enableObjectDetection?

() => Options

enablePlaneDetection?

() => Options

enableReticles?

() => Options

enableSimulator?

boolean = true

enableUI?

() => Options

enableVR?

() => Options

enableXRTransitions?

() => Options

formFactor?

"auto" | "xr" | "hud" | "vr" | "desktop" | "mobile"

gestures?

{ enable?: () => GestureRecognitionOptions; enabled?: boolean; gestures?: { fist?: { enabled?: boolean; threshold?: number; }; open-palm?: { enabled?: boolean; threshold?: number; }; pinch?: { enabled?: boolean; threshold?: number; }; point?: { enabled?: boolean; threshold?: number; }; spread?: { enabled?: boolean; threshold?: number; }; thumbs-up?: { enabled?: boolean; threshold?: number; }; }; minimumConfidence?: number; provider?: GestureProvider; setGestureEnabled?: (name, enabled) => GestureRecognitionOptions; updateIntervalMs?: number; } = ...

gestures.enable?

() => GestureRecognitionOptions

gestures.enabled?

boolean = false

Master switch for the gesture recognition block.

gestures.gestures?

{ fist?: { enabled?: boolean; threshold?: number; }; open-palm?: { enabled?: boolean; threshold?: number; }; pinch?: { enabled?: boolean; threshold?: number; }; point?: { enabled?: boolean; threshold?: number; }; spread?: { enabled?: boolean; threshold?: number; }; thumbs-up?: { enabled?: boolean; threshold?: number; }; } = ...

Default gesture catalogue.

gestures.gestures.fist?

{ enabled?: boolean; threshold?: number; }

gestures.gestures.fist.enabled?

boolean

gestures.gestures.fist.threshold?

number

Optional override for gesture-specific score thresholds. For distance based gestures this is treated as a maximum distance; for confidence based gestures it is treated as a minimum score.

gestures.gestures.open-palm?

{ enabled?: boolean; threshold?: number; }

gestures.gestures.open-palm.enabled?

boolean

gestures.gestures.open-palm.threshold?

number

Optional override for gesture-specific score thresholds. For distance based gestures this is treated as a maximum distance; for confidence based gestures it is treated as a minimum score.

gestures.gestures.pinch?

{ enabled?: boolean; threshold?: number; }

gestures.gestures.pinch.enabled?

boolean

gestures.gestures.pinch.threshold?

number

Optional override for gesture-specific score thresholds. For distance based gestures this is treated as a maximum distance; for confidence based gestures it is treated as a minimum score.

gestures.gestures.point?

{ enabled?: boolean; threshold?: number; }

gestures.gestures.point.enabled?

boolean

gestures.gestures.point.threshold?

number

Optional override for gesture-specific score thresholds. For distance based gestures this is treated as a maximum distance; for confidence based gestures it is treated as a minimum score.

gestures.gestures.spread?

{ enabled?: boolean; threshold?: number; }

gestures.gestures.spread.enabled?

boolean

gestures.gestures.spread.threshold?

number

Optional override for gesture-specific score thresholds. For distance based gestures this is treated as a maximum distance; for confidence based gestures it is treated as a minimum score.

gestures.gestures.thumbs-up?

{ enabled?: boolean; threshold?: number; }

gestures.gestures.thumbs-up.enabled?

boolean

gestures.gestures.thumbs-up.threshold?

number

Optional override for gesture-specific score thresholds. For distance based gestures this is treated as a maximum distance; for confidence based gestures it is treated as a minimum score.

gestures.minimumConfidence?

number = 0.6

Minimum confidence score to emit gesture events. Different providers map to different score domains so this value is normalised to [0-1].

gestures.provider?

GestureProvider = 'heuristics'

Backing provider that extracts gesture information.

'heuristics': WebXR joint heuristics only (no external ML dependency).
'mediapipe': MediaPipe Hands running via Web APIs / wasm.
'tfjs': TensorFlow.js hand-pose-detection models.

gestures.setGestureEnabled?

(name, enabled) => GestureRecognitionOptions

gestures.updateIntervalMs?

number = 33

Optional throttle window for expensive providers.

hands?

{ debugging?: boolean; enabled?: boolean; enableHands?: () => HandsOptions; enableHandsVisualization?: () => HandsOptions; visualization?: boolean; visualizeJoints?: boolean; visualizeMeshes?: boolean; } = ...

hands.debugging?

boolean = false

hands.enabled?

boolean = false

Whether hand tracking is enabled.

hands.enableHands?

() => HandsOptions

hands.enableHandsVisualization?

() => HandsOptions

hands.visualization?

boolean = false

Whether to show any hand visualization.

hands.visualizeJoints?

boolean = false

Whether to show the tracked hand joints.

hands.visualizeMeshes?

boolean = false

Whether to show the virtual hand meshes.

lighting?

{ castDirectionalLightShadow?: boolean; debugging?: boolean; enabled?: boolean; useAmbientSH?: boolean; useDirectionalLight?: boolean; useDynamicSoftShadow?: boolean; } = ...

lighting.castDirectionalLightShadow?

boolean = false

Cast shadows using diretional light.

lighting.debugging?

boolean = false

Enables debugging renders and logs.

lighting.enabled?

boolean = false

Enables XR lighting.

lighting.useAmbientSH?

boolean = false

Add ambient spherical harmonics to lighting.

lighting.useDirectionalLight?

boolean = false

Add main diredtional light to lighting.

lighting.useDynamicSoftShadow?

boolean = false

Adjust hardness of shadows according to relative brightness of main light.

logarithmicDepthBuffer?

boolean = false

Whether to use a logarithmic depth buffer. Useful for depth-aware occlusions.

permissions?

{ camera?: boolean; geolocation?: boolean; microphone?: boolean; } = ...

Which permissions to request before entering the XR session.

permissions.camera?

boolean = false

permissions.geolocation?

boolean = false

permissions.microphone?

boolean = false

physics?

{ fps?: number; gravity?: { x?: number; y?: number; z?: number; }; RAPIER?: { init?: () => Promise<void>; }; useEventQueue?: boolean; worldStep?: boolean; } = ...

physics.fps?

number = 45

The target frames per second for the physics simulation loop.

physics.gravity?

{ x?: number; y?: number; z?: number; } = ...

The global gravity vector applied to the physics world.

physics.gravity.x?

number = 0.0

physics.gravity.y?

number = -9.81

physics.gravity.z?

number = 0.0

physics.RAPIER?

{ init?: () => Promise<void>; }

Instance of RAPIER.

physics.RAPIER.init?

() => Promise<void>

physics.useEventQueue?

boolean = false

If true, an event queue will be created and passed to world.step(), enabling the handling of collision and contact events.

physics.worldStep?

boolean = true

If true, the Physics manager will automatically call world.step() on its fixed interval. Set to false if you want to control the simulation step manually.

referenceSpaceType?

XRReferenceSpaceType = 'local-floor'

reticles?

{ enabled?: boolean; } = ...

reticles.enabled?

boolean = true

setAppDescription?

(description) => Options

setAppTitle?

(title) => Options

simulator?

{ blendingMode?: "normal" | "screen"; defaultHand?: Handedness; defaultMode?: SimulatorMode; geminiLivePanel?: { element?: string; enabled?: boolean; }; handPosePanel?: { element?: string; enabled?: boolean; }; initialCameraPosition?: { x?: number; y?: number; z?: number; }; initialScenePosition?: { x?: number; y?: number; z?: number; }; instructions?: { customInstructions?: readonly (undefined | { description?: ... | ... | ...; header?: ... | ... | ...; videoSrc?: ... | ...; })[]; element?: string; enabled?: boolean; }; modeIndicator?: { element?: string; enabled?: boolean; }; modeToggle?: { toggleKey?: null | Keycodes; toggleOrder?: { Hands?: SimulatorMode; Navigation?: SimulatorMode; User?: SimulatorMode; }; }; renderToRenderTexture?: boolean; scenePath?: null | string; scenePlanesPath?: null | string; stereo?: { enabled?: boolean; }; videoPath?: string; } = ...

simulator.blendingMode?

"normal" | "screen" = 'normal'

simulator.defaultHand?

Handedness = Handedness.LEFT

simulator.defaultMode?

SimulatorMode = SimulatorMode.USER

simulator.geminiLivePanel?

{ element?: string; enabled?: boolean; } = ...

simulator.geminiLivePanel.element?

string = 'xrblocks-simulator-geminilive'

simulator.geminiLivePanel.enabled?

boolean = false

simulator.handPosePanel?

{ element?: string; enabled?: boolean; } = ...

simulator.handPosePanel.element?

string = 'xrblocks-simulator-hand-pose-panel'

simulator.handPosePanel.enabled?

boolean = true

simulator.initialCameraPosition?

{ x?: number; y?: number; z?: number; } = ...

simulator.initialCameraPosition.x?

number = 0

simulator.initialCameraPosition.y?

number = 1.5

simulator.initialCameraPosition.z?

number = 0

simulator.initialScenePosition?

{ x?: number; y?: number; z?: number; } = ...

simulator.initialScenePosition.x?

number = -1.6

simulator.initialScenePosition.y?

number = 0.3

simulator.initialScenePosition.z?

number = 0

simulator.instructions?

{ customInstructions?: readonly (undefined | { description?: ... | ... | ...; header?: ... | ... | ...; videoSrc?: ... | ...; })[]; element?: string; enabled?: boolean; } = ...

simulator.instructions.customInstructions?

readonly (undefined | { description?: ... | ... | ...; header?: ... | ... | ...; videoSrc?: ... | ...; })[] = ...

simulator.instructions.element?

string = 'xrblocks-simulator-instructions'

simulator.instructions.enabled?

boolean = true

simulator.modeIndicator?

{ element?: string; enabled?: boolean; } = ...

simulator.modeIndicator.element?

string = 'xrblocks-simulator-mode-indicator'

simulator.modeIndicator.enabled?

boolean = true

simulator.modeToggle?

{ toggleKey?: null | Keycodes; toggleOrder?: { Hands?: SimulatorMode; Navigation?: SimulatorMode; User?: SimulatorMode; }; } = ...

simulator.modeToggle.toggleKey?

null | Keycodes = ...

simulator.modeToggle.toggleOrder?

{ Hands?: SimulatorMode; Navigation?: SimulatorMode; User?: SimulatorMode; } = DEFAULT_MODE_TOGGLE_ORDER

simulator.modeToggle.toggleOrder.Hands?

SimulatorMode = SimulatorMode.USER

simulator.modeToggle.toggleOrder.Navigation?

SimulatorMode = SimulatorMode.CONTROLLER

simulator.modeToggle.toggleOrder.User?

SimulatorMode = SimulatorMode.POSE

simulator.renderToRenderTexture?

boolean = true

simulator.scenePath?

null | string = ...

simulator.scenePlanesPath?

null | string = ...

simulator.stereo?

{ enabled?: boolean; } = ...

simulator.stereo.enabled?

boolean = false

simulator.videoPath?

string = undefined

sound?

{ speechRecognizer?: { commandConfidenceThreshold?: number; commands?: readonly (undefined | string)[]; continuous?: boolean; enabled?: boolean; interimResults?: boolean; lang?: string; playSimulatorActivationSounds?: boolean; }; speechSynthesizer?: { allowInterruptions?: boolean; enabled?: boolean; }; } = ...

sound.speechRecognizer?

{ commandConfidenceThreshold?: number; commands?: readonly (undefined | string)[]; continuous?: boolean; enabled?: boolean; interimResults?: boolean; lang?: string; playSimulatorActivationSounds?: boolean; } = ...

sound.speechRecognizer.commandConfidenceThreshold?

number = 0.7

Minimum confidence (0-1) for a command.

sound.speechRecognizer.commands?

readonly (undefined | string)[] = []

Keywords to detect as commands.

sound.speechRecognizer.continuous?

boolean = false

If true, recognition continues after a pause.

sound.speechRecognizer.enabled?

boolean = true

sound.speechRecognizer.interimResults?

boolean = false

If true, provides interim results.

sound.speechRecognizer.lang?

string = 'en-US'

Recognition language (e.g., 'en-US').

sound.speechRecognizer.playSimulatorActivationSounds?

boolean = true

If true, play activation sounds in simulator.

sound.speechSynthesizer?

{ allowInterruptions?: boolean; enabled?: boolean; } = ...

sound.speechSynthesizer.allowInterruptions?

boolean = false

If true, a new call to speak() will interrupt any ongoing speech.

sound.speechSynthesizer.enabled?

boolean = false

stencil?

boolean = false

Whether to request a stencil buffer.

transition?

{ defaultBackgroundColor?: number; enabled?: boolean; transitionTime?: number; } = ...

transition.defaultBackgroundColor?

number = 0xffffff

The default background color for VR transitions.

transition.enabled?

boolean = false

Whether the transition effect is enabled.

transition.transitionTime?

number = 0.5

The duration of the transition in seconds.

usePostprocessing?

boolean = false

Whether to use post-processing effects.

webxrRequiredFeatures?

readonly (undefined | string)[] = []

Any additional required features when initializing webxr.

world?

{ debugging?: boolean; enabled?: boolean; enableMeshDetection?: () => WorldOptions; enableObjectDetection?: () => WorldOptions; enablePlaneDetection?: () => WorldOptions; initiateRoomCapture?: boolean; meshes?: { enable?: () => MeshDetectionOptions; enabled?: boolean; showDebugVisualizations?: boolean; }; objects?: { backendConfig?: { activeBackend?: "gemini" | "mediapipe"; gemini?: { responseSchema?: ... | ...; systemInstruction?: ... | ...; }; mediapipe?: { }; }; debugging?: boolean; enable?: () => ObjectsOptions; enabled?: boolean; objectImageMargin?: number; showDebugVisualizations?: boolean; }; planes?: { debugging?: boolean; enable?: () => PlanesOptions; enabled?: boolean; showDebugVisualizations?: boolean; }; } = ...

world.debugging?

boolean = false

world.enabled?

boolean = false

world.initiateRoomCapture?

boolean = false

world.meshes?

{ enable?: () => MeshDetectionOptions; enabled?: boolean; showDebugVisualizations?: boolean; } = ...

world.meshes.enable?

() => MeshDetectionOptions

world.meshes.enabled?

boolean = false

world.meshes.showDebugVisualizations?

boolean = false

world.objects?

{ backendConfig?: { activeBackend?: "gemini" | "mediapipe"; gemini?: { responseSchema?: ... | ...; systemInstruction?: ... | ...; }; mediapipe?: { }; }; debugging?: boolean; enable?: () => ObjectsOptions; enabled?: boolean; objectImageMargin?: number; showDebugVisualizations?: boolean; } = ...

world.objects.backendConfig?

{ activeBackend?: "gemini" | "mediapipe"; gemini?: { responseSchema?: ... | ...; systemInstruction?: ... | ...; }; mediapipe?: { }; } = ...

Configuration for the detection backends.

world.objects.backendConfig.activeBackend?

"gemini" | "mediapipe" = ...

The active backend to use for detection.

world.objects.backendConfig.gemini?

{ responseSchema?: ... | ...; systemInstruction?: ... | ...; } = ...

world.objects.backendConfig.gemini.responseSchema?

... | ... = ...

world.objects.backendConfig.gemini.systemInstruction?

... | ... = ...

world.objects.backendConfig.mediapipe?

{ } = {}

Placeholder for a future MediaPipe backend configuration.

world.objects.debugging?

boolean = false

world.objects.enable?

() => ObjectsOptions

world.objects.enabled?

boolean = false

world.objects.objectImageMargin?

number = 0.05

Margin to add when cropping the object image, as a percentage of image size.

world.objects.showDebugVisualizations?

boolean = false

world.planes?

{ debugging?: boolean; enable?: () => PlanesOptions; enabled?: boolean; showDebugVisualizations?: boolean; } = ...

world.planes.debugging?

boolean = false

world.planes.enable?

() => PlanesOptions

world.planes.enabled?

boolean = false

world.planes.showDebugVisualizations?

boolean = false

xrButton?

{ alwaysAutostartSimulator?: boolean; appDescription?: string; appTitle?: string; enabled?: boolean; endText?: string; invalidText?: string; showEnterSimulatorButton?: boolean; startSimulatorText?: string; startText?: string; } = ...

Configuration for the XR session button.

xrButton.alwaysAutostartSimulator?

boolean = false

xrButton.appDescription?

string = ''

xrButton.appTitle?

string = ''

xrButton.enabled?

boolean = true

xrButton.endText?

string = 'Exit XR'

xrButton.invalidText?

string = 'XR Not Supported'

xrButton.showEnterSimulatorButton?

boolean = false

xrButton.startSimulatorText?

string = 'Enter Simulator'

xrButton.startText?

string = 'Enter XR'

xrSessionMode?

XRSessionMode = 'immersive-ar'

Returns

Options

Properties

ai

ai: AIOptions

Defined in: src/core/Options.ts:105

antialias

antialias: boolean = true

Defined in: src/core/Options.ts:68

Whether to use antialiasing.

camera

camera: object

Defined in: src/core/Options.ts:110

far

far: number = 500

near

near: number = 0.01

canvas?

optional canvas: HTMLCanvasElement

Defined in: src/core/Options.ts:86

Canvas element to use for rendering. If not defined, a new element will be added to document body.

controllers

controllers: InputOptions

Defined in: src/core/Options.ts:97

debugging

debugging: boolean = false

Defined in: src/core/Options.ts:77

Global flag for enabling various debugging features.

depth

depth: DepthOptions

Defined in: src/core/Options.ts:98

deviceCamera

deviceCamera: DeviceCameraOptions

Defined in: src/core/Options.ts:100

enableSimulator

enableSimulator: boolean = true

Defined in: src/core/Options.ts:120

gestures

gestures: GestureRecognitionOptions

Defined in: src/core/Options.ts:102

hands

hands: HandsOptions

Defined in: src/core/Options.ts:101

lighting

lighting: LightingOptions

Defined in: src/core/Options.ts:99

logarithmicDepthBuffer

logarithmicDepthBuffer: boolean = false

Defined in: src/core/Options.ts:73

Whether to use a logarithmic depth buffer. Useful for depth-aware occlusions.

permissions

permissions: object

Defined in: src/core/Options.ts:141

Which permissions to request before entering the XR session.

camera

camera: boolean = false

geolocation

geolocation: boolean = false

microphone

microphone: boolean = false

physics

physics: PhysicsOptions

Defined in: src/core/Options.ts:108

referenceSpaceType

referenceSpaceType: XRReferenceSpaceType = 'local-floor'

Defined in: src/core/Options.ts:95

reticles

reticles: ReticleOptions

Defined in: src/core/Options.ts:103

simulator

simulator: SimulatorOptions

Defined in: src/core/Options.ts:106

sound

sound: SoundOptions

Defined in: src/core/Options.ts:104

stencil

stencil: boolean = false

Defined in: src/core/Options.ts:81

Whether to request a stencil buffer.

transition

transition: XRTransitionOptions

Defined in: src/core/Options.ts:109

usePostprocessing

usePostprocessing: boolean = false

Defined in: src/core/Options.ts:118

Whether to use post-processing effects.

webxrRequiredFeatures

webxrRequiredFeatures: string[] = []

Defined in: src/core/Options.ts:91

Any additional required features when initializing webxr.

world

world: WorldOptions

Defined in: src/core/Options.ts:107

xrButton

xrButton: object

Defined in: src/core/Options.ts:125

Configuration for the XR session button.

alwaysAutostartSimulator

alwaysAutostartSimulator: boolean = false

appDescription

appDescription: string = ''

appTitle

appTitle: string = ''

enabled

enabled: boolean = true

endText

endText: string = 'Exit XR'

invalidText

invalidText: string = 'XR Not Supported'

showEnterSimulatorButton

showEnterSimulatorButton: boolean = false

startSimulatorText

startSimulatorText: string = 'Enter Simulator'

startText

startText: string = 'Enter XR'

xrSessionMode

xrSessionMode: XRSessionMode = 'immersive-ar'

Defined in: src/core/Options.ts:147

Accessors

formFactor

Get Signature

get formFactor(): "auto" | "xr" | "hud" | "vr" | "desktop" | "mobile"

Defined in: src/core/Options.ts:151

Returns

"auto" | "xr" | "hud" | "vr" | "desktop" | "mobile"

Set Signature

set formFactor(formFactor): void

Defined in: src/core/Options.ts:160

Form factor is a preset that configures the experience for a specific device type. Currently it only controls whether the simulator is enabled and should always be autostarted.

Parameters

formFactor

"auto" | "xr" | "hud" | "vr" | "desktop" | "mobile"

Returns

void

Methods

enableAI()

enableAI(): Options

Defined in: src/core/Options.ts:297

Enables a standard set of AI features, including Gemini Live.

Returns

Options

The instance for chaining.

enableCamera()

enableCamera(facingMode): Options

Defined in: src/core/Options.ts:255

Enables device camera (passthrough) with a specific facing mode.

Parameters

facingMode

The desired camera facing mode, either 'environment' or 'user'.

"user" | "environment"

Returns

Options

The instance for chaining.

enableControllers()

enableControllers(): Options

Defined in: src/core/Options.ts:318

Enables input from hands and controllers. Note that this is enabled by default and can also be changed at runtime with xb.core.input.enableControllers() and xb.core.input.disableControllers().

Returns

Options

The instance for chaining.

enableDepth()

enableDepth(): Options

Defined in: src/core/Options.ts:225

Enables depth sensing in WebXR with default options.

Returns

Options

The instance for chaining.

enableGestures()

enableGestures(): Options

Defined in: src/core/Options.ts:278

Enables the gesture recognition block and ensures hands are available.

Returns

Options

The instance for chaining.

enableHandRays()

enableHandRays(): Options

Defined in: src/core/Options.ts:288

Enables the visualization of rays for hand tracking.

Returns

Options

The instance for chaining.

enableHands()

enableHands(): Options

Defined in: src/core/Options.ts:269

Enables hand tracking.

Returns

Options

The instance for chaining.

enableObjectDetection()

enableObjectDetection(): Options

Defined in: src/core/Options.ts:243

Enables object detection.

Returns

Options

The instance for chaining.

enablePlaneDetection()

enablePlaneDetection(): Options

Defined in: src/core/Options.ts:234

Enables plane detection.

Returns

Options

The instance for chaining.

enableReticles()

enableReticles(): Options

Defined in: src/core/Options.ts:216

Enables reticles for visualizing targets of hand rays in WebXR.

Returns

Options

The instance for chaining.

enableUI()

enableUI(): Options

Defined in: src/core/Options.ts:206

Enables a standard set of options for a UI-focused experience.

Returns

Options

The instance for chaining.

enableVR()

enableVR(): Options

Defined in: src/core/Options.ts:195

Sets the session mode to VR and disables the simulator passthrough scene.

Returns

Options

enableXRTransitions()

enableXRTransitions(): Options

Defined in: src/core/Options.ts:307

Enables the XR transition component for toggling VR.

Returns

Options

The instance for chaining.

parseUrlParams()

protected parseUrlParams(): void

Defined in: src/core/Options.ts:182

Returns

void

setAppDescription()

setAppDescription(description): Options

Defined in: src/core/Options.ts:338

Sets the description of the app to be displayed above the XR button.

Parameters

description

string

The description of the app.

Returns

Options

The instance for chaining.

setAppTitle()

setAppTitle(title): Options

Defined in: src/core/Options.ts:328

Sets the title of the app to be displayed above the XR button.

Parameters

title

string

The title of the app.

Returns

Options

The instance for chaining.

Constructors​

Constructor​

Parameters​

options?​

ai?​

ai.enabled?​

ai.gemini?​

ai.gemini.apiKey?​

ai.gemini.config?​

ai.gemini.enabled?​

ai.gemini.keyValid?​

ai.gemini.liveModel?​

ai.gemini.model?​

ai.gemini.urlParam?​

ai.globalUrlParams?​

ai.globalUrlParams.key?​

ai.model?​

ai.openai?​

ai.openai.apiKey?​

ai.openai.enabled?​

ai.openai.model?​

ai.openai.urlParam?​

antialias?​

camera?​

camera.far?​

camera.near?​

canvas?​

controllers?​

controllers.debug?​

controllers.enabled?​

controllers.enabledMouse?​

controllers.performRaycastOnUpdate?​

controllers.visualization?​

controllers.visualizeRays?​

debugging?​

depth?​

depth.debugging?​

depth.depthMesh?​

depth.depthMesh.colliderUpdateFps?​

depth.depthMesh.depthFullResolution?​

depth.depthMesh.depthMeshUpdateFps?​

depth.depthMesh.enabled?​

depth.depthMesh.ignoreEdgePixels?​

depth.depthMesh.opacity?​

depth.depthMesh.patchHoles?​

depth.depthMesh.patchHolesUpper?​

depth.depthMesh.renderShadow?​

depth.depthMesh.shadowOpacity?​

depth.depthMesh.showDebugTexture?​

depth.depthMesh.updateFullResolutionGeometry?​

depth.depthMesh.updateVertexNormals?​

depth.depthMesh.useDepthTexture?​

depth.depthMesh.useDownsampledGeometry?​

depth.depthMesh.useDualCollider?​

depth.depthTexture?​

depth.depthTexture.applyGaussianBlur?​

depth.depthTexture.applyKawaseBlur?​

depth.depthTexture.constantKernel?​

depth.depthTexture.enabled?​

depth.depthTypeRequest?​

depth.enabled?​

depth.matchDepthView?​

depth.occlusion?​

depth.occlusion.enabled?​

depth.useFloat32?​

deviceCamera?​

deviceCamera.cameraLabel?​

deviceCamera.enabled?​

deviceCamera.rgbToDepthParams?​

deviceCamera.rgbToDepthParams.k1?​

deviceCamera.rgbToDepthParams.k2?​

deviceCamera.rgbToDepthParams.k3?​

deviceCamera.rgbToDepthParams.p1?​

deviceCamera.rgbToDepthParams.p2?​

deviceCamera.rgbToDepthParams.scale?​

deviceCamera.rgbToDepthParams.scaleX?​

deviceCamera.rgbToDepthParams.scaleY?​

deviceCamera.rgbToDepthParams.translateU?​

deviceCamera.rgbToDepthParams.translateV?​

deviceCamera.rgbToDepthParams.xc?​

Constructors

Constructor

Parameters

options?

ai?

ai.enabled?

ai.gemini?

ai.gemini.apiKey?

ai.gemini.config?

ai.gemini.enabled?

ai.gemini.keyValid?

ai.gemini.liveModel?

ai.gemini.model?

ai.gemini.urlParam?

ai.globalUrlParams?

ai.globalUrlParams.key?

ai.model?

ai.openai?

ai.openai.apiKey?

ai.openai.enabled?

ai.openai.model?

ai.openai.urlParam?

antialias?

camera?

camera.far?

camera.near?

canvas?

controllers?

controllers.debug?

controllers.enabled?

controllers.enabledMouse?

controllers.performRaycastOnUpdate?

controllers.visualization?

controllers.visualizeRays?

debugging?

depth?

depth.debugging?

depth.depthMesh?

depth.depthMesh.colliderUpdateFps?

depth.depthMesh.depthFullResolution?

depth.depthMesh.depthMeshUpdateFps?

depth.depthMesh.enabled?

depth.depthMesh.ignoreEdgePixels?

depth.depthMesh.opacity?

depth.depthMesh.patchHoles?

depth.depthMesh.patchHolesUpper?

depth.depthMesh.renderShadow?

depth.depthMesh.shadowOpacity?

depth.depthMesh.showDebugTexture?

depth.depthMesh.updateFullResolutionGeometry?

depth.depthMesh.updateVertexNormals?

depth.depthMesh.useDepthTexture?

depth.depthMesh.useDownsampledGeometry?

depth.depthMesh.useDualCollider?

depth.depthTexture?

depth.depthTexture.applyGaussianBlur?

depth.depthTexture.applyKawaseBlur?

depth.depthTexture.constantKernel?

depth.depthTexture.enabled?

depth.depthTypeRequest?

depth.enabled?

depth.matchDepthView?

depth.occlusion?

depth.occlusion.enabled?

depth.useFloat32?

deviceCamera?

deviceCamera.cameraLabel?

deviceCamera.enabled?

deviceCamera.rgbToDepthParams?

deviceCamera.rgbToDepthParams.k1?

deviceCamera.rgbToDepthParams.k2?

deviceCamera.rgbToDepthParams.k3?

deviceCamera.rgbToDepthParams.p1?

deviceCamera.rgbToDepthParams.p2?

deviceCamera.rgbToDepthParams.scale?

deviceCamera.rgbToDepthParams.scaleX?

deviceCamera.rgbToDepthParams.scaleY?

deviceCamera.rgbToDepthParams.translateU?

deviceCamera.rgbToDepthParams.translateV?

deviceCamera.rgbToDepthParams.xc?