Skip to main content

onStart()

onStart: ({ canvas, GLctx, computeCtx, isWebgl2, orientation, videoWidth, videoHeight, canvasWidth, canvasHeight, config })

Description

onStart() is called when XR starts.

Parameters

ParameterDescription
canvasThe canvas that backs GPU processing and user display.
GLctxThe drawing canvas's WebGLRenderingContext or WebGL2RenderingContext.
computeCtxThe compute canvas's WebGLRenderingContext or WebGL2RenderingContext.
isWebgl2True if GLctx is a WebGL2RenderingContext.
orientationThe rotation of the UI from portrait, in degrees (-90, 0, 90, 180).
videoWidthThe height of the camera feed, in pixels.
videoHeightThe height of the camera feed, in pixels.
canvasWidthThe width of the GLctx canvas, in pixels.
canvasHeightThe height of the GLctx canvas, in pixels.
configThe configuration parameters that were passed to XR8.run().

Example

XR8.addCameraPipelineModule({
name: 'mycamerapipelinemodule',
onStart: ({canvasWidth, canvasHeight}) => {
// Get the three.js scene. This was created by XR8.Threejs.pipelineModule().onStart(). The
// reason we can access it here now is because 'mycamerapipelinemodule' was installed after
// XR8.Threejs.pipelineModule().
const {scene, camera} = XR8.Threejs.xrScene()

// Add some objects to the scene and set the starting camera position.
myInitXrScene({scene, camera})

// Sync the xr controller's 6DoF position and camera paremeters with our scene.
XR8.XrController.updateCameraProjectionMatrix({
origin: camera.position,
facing: camera.quaternion,
})
},
})