Class: World ​

WebSG.World

Class representing a 3D world composed of scenes, nodes, meshes, materials, and other properties defined by the glTF 2.0 specification.

Currently a World contains resources loaded for the environment's glTF document. This means you do not have direct access to user's avatars in the world's scene graph. On script initialization, the world will be empty. It is not until world.onload is called that world.environment will be set to the default scene in the world's initial glTF document. All other resources such as textures, materials, and meshes referenced by the document will be loaded at this time and can be accessed via methods such as world.findNodeByName .

Example

In the following example world.findNodeByName is used to find a node by its name and log the reference to the console.

// World not yet loaded

world.onload = () => {
  // World loaded
  const lightNode = world.findNodeByName("Light");
  console.log(lightNode);
};

Once a world is loaded you can modify the scene graph by adding, removing, or modifying nodes.

Example

world.onload = () => {
  const newNode = world.createNode();
  world.environment.addNode(newNode); // Nodes must be added to a scene to be rendered

  newNode.mesh = world.findMeshByName("Teapot");

  world.environment.removeNode(newNode);
};

If you want to modify the scene graph each frame you can use the world.onupdate callback.

Example

world.onload = () => {
  const newNode = world.createNode();
  world.environment.addNode(newNode);

  newNode.mesh = world.findMeshByName("Teapot");

  world.onupdate = (dt, time) => {
    newNode.translation.y = Math.sin(time) * 5;
  };
};

Once the local user has entered the world, the networking interface will be fully initialized. You access the local user's peer via the global network.local variable. This can be used to get the local user's transform.

Example

world.onenter = () => {
  const localUser = network.local;
  console.log(localUser.transform);
  console.log(localUser.rotation);
};

Overall, world is the main interface for creating new resources. See the individual factory functions for more details.

Table of contents ​

Constructors ​

• constructor

Properties ​

• onenter
• onload
• onupdate

Accessors ​

• componentStoreSize
• environment
• primaryInputSourceDirection
• primaryInputSourceOrigin

Methods ​

• createAccessorFrom
• createBoxMesh
• createCollider
• createCollisionListener
• createLight
• createMaterial
• createMesh
• createNode
• createScene
• createUIButton
• createUICanvas
• createUIElement
• createUIText
• createUnlitMaterial
• findAccessorByName
• findColliderByName
• findComponentStoreByName
• findImageByName
• findLightByName
• findMaterialByName
• findMeshByName
• findNodeByName
• findSceneByName
• findTextureByName
• findUICanvasByName
• findUIElementByName
• stopOrbit

Constructors ​

constructor ​

• new World()

Properties ​

onenter ​

• onenter: null | () => any

Called when the user enters the world. The network.local peer has been set and the user has been spawned into the world.

Defined in ​

websg.d.ts:2481

onload ​

• onload: null | () => any

Called when the world is loaded. The glTF document has been loaded and all resources are available.

Defined in ​

websg.d.ts:2475

onupdate ​

• onupdate: null | (dt: number, time: number) => any

Called once per frame when the world is updated.

Param

The time since the last update in seconds.

Param

The total time since the start of the world in seconds.

Defined in ​

websg.d.ts:2488

Accessors ​

componentStoreSize ​

• get componentStoreSize(): number

Returns the maximum number of components per type that can be stored in the world. Defaults to 10000.

Returns ​

number

Defined in ​

websg.d.ts:2437

• set componentStoreSize(value): void

Sets the maximum number of components per type that can be stored in the world. Defaults to 10000.

Parameters ​

Returns ​

void

Defined in ​

websg.d.ts:2443

environment ​

• get environment(): Scene

Gets the environment of the world. Note this is not set until world.onload is called.

Returns ​

Scene

Defined in ​

websg.d.ts:2273

• set environment(scene): void

Sets the environment of the world.

Parameters ​

Returns ​

void

Defined in ​

websg.d.ts:2279

primaryInputSourceDirection ​

• get primaryInputSourceDirection(): Vector3

Get the primary input source's direction in world space. The primary input source in XR is the user's primary controller otherwise it's the camera. This API is experimental and may change or be removed in a future release.

Returns ​

Vector3

Defined in ​

websg.d.ts:2469

primaryInputSourceOrigin ​

• get primaryInputSourceOrigin(): Vector3

Get the primary input source's origin in world space. The primary input source in XR is the user's primary controller otherwise it's the camera. This API is experimental and may change or be removed in a future release.

Returns ​

Vector3

Defined in ​

websg.d.ts:2462

Methods ​

createAccessorFrom ​

▸ createAccessorFrom(buffer, props): Accessor

Creates an Accessor from the given ArrayBuffer and properties.

Parameters ​

Returns ​

Accessor

Defined in ​

websg.d.ts:2286

createBoxMesh ​

▸ createBoxMesh(props): Mesh

Creates a Box Mesh with the given properties.

Parameters ​

Returns ​

Mesh

Defined in ​

websg.d.ts:2346

createCollider ​

▸ createCollider(props): Collider

Creates a Collider with the given properties.

Parameters ​

Returns ​

Collider

Defined in ​

websg.d.ts:2298

createCollisionListener ​

▸ createCollisionListener(): CollisionListener

Creates a new CollisionListener for listening to collisions between nodes with colliders set on them.

Returns ​

CollisionListener

Defined in ​

websg.d.ts:2431

createLight ​

▸ createLight(props): Light

Creates a Light with the given properties.

Parameters ​

Returns ​

Light

Defined in ​

websg.d.ts:2310

createMaterial ​

▸ createMaterial(props): Material

Creates a Material with the given properties.

Parameters ​

Returns ​

Material

Defined in ​

websg.d.ts:2328

createMesh ​

▸ createMesh(props): Mesh

Creates a Mesh with the given properties.

Parameters ​

Returns ​

Mesh

Defined in ​

websg.d.ts:2340

createNode ​

▸ createNode(props?): Node

Creates a new Node with the given properties.

Parameters ​

Returns ​

Node

Defined in ​

websg.d.ts:2358

createScene ​

▸ createScene(props?): Scene

Creates a new Scene with the given properties.

Parameters ​

Returns ​

Scene

Defined in ​

websg.d.ts:2370

createUIButton ​

▸ createUIButton(props?): UIButton

Creates a new UIButton with the given properties.

Parameters ​

Returns ​

UIButton

Defined in ​

websg.d.ts:2419

createUICanvas ​

▸ createUICanvas(props?): UICanvas

Creates a new UICanvas with the given properties.

Parameters ​

Returns ​

UICanvas

Defined in ​

websg.d.ts:2394

createUIElement ​

▸ createUIElement(props?): UIElement

Creates a new UIElement with the given properties.

Parameters ​

Returns ​

UIElement

Defined in ​

websg.d.ts:2406

createUIText ​

▸ createUIText(props?): UIText

Creates a new UIText with the given properties.

Method

createUIText

Parameters ​

Returns ​

UIText

Defined in ​

websg.d.ts:2413

createUnlitMaterial ​

▸ createUnlitMaterial(props): Material

Creates an unlit Material with the given properties.

Parameters ​

Returns ​

Material

Defined in ​

websg.d.ts:2322

findAccessorByName ​

▸ findAccessorByName(name): undefined | Accessor

Finds an Accessor by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Accessor

Defined in ​

websg.d.ts:2292

findColliderByName ​

▸ findColliderByName(name): undefined | Collider

Finds a Collider by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Collider

Defined in ​

websg.d.ts:2304

findComponentStoreByName ​

▸ findComponentStoreByName(name): undefined | ComponentStore

Find the ComponentStore for the given component type. Returns undefined if not found.

Parameters ​

Returns ​

undefined | ComponentStore

Defined in ​

websg.d.ts:2450

findImageByName ​

▸ findImageByName(name): undefined | Image

Finds an image by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Image

Defined in ​

websg.d.ts:2388

findLightByName ​

▸ findLightByName(name): undefined | Light

Finds a Light by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Light

Defined in ​

websg.d.ts:2316

findMaterialByName ​

▸ findMaterialByName(name): undefined | Material

Finds a Material by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Material

Defined in ​

websg.d.ts:2334

findMeshByName ​

▸ findMeshByName(name): undefined | Mesh

Finds a Mesh by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Mesh

Defined in ​

websg.d.ts:2352

findNodeByName ​

▸ findNodeByName(name): undefined | Node

Finds a node by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Node

Defined in ​

websg.d.ts:2364

findSceneByName ​

▸ findSceneByName(name): undefined | Scene

Finds a scene by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Scene

Defined in ​

websg.d.ts:2376

findTextureByName ​

▸ findTextureByName(name): undefined | Texture

Finds a texture by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | Texture

Defined in ​

websg.d.ts:2382

findUICanvasByName ​

▸ findUICanvasByName(name): undefined | UICanvas

Finds a UICanvas by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | UICanvas

Defined in ​

websg.d.ts:2400

findUIElementByName ​

▸ findUIElementByName(name): undefined | UIElement

Finds a UIElement by its name. Returns undefined if not found.

Parameters ​

Returns ​

undefined | UIElement

Defined in ​

websg.d.ts:2425

stopOrbit ​

▸ stopOrbit(): undefined

Stops any ongoing orbiting operation.

Returns ​

undefined

Defined in ​

websg.d.ts:2455