Visit the Documentation of the upcoming Threlte 6.
  1. @threlte/rapier
  2. World

@threlte/rapier

World

This component provides the basic physics context and loads rapier.

All components that rely on physics (e.g. <RigidBody> or <Collider>) must be a child of <World>.

Import

Source

Github View Source Code

Package

NPM View Package

Related Docs


Structure

A typical structure of a physics-enabled wrapper component might look like this:

Wrapper.svelte
<script lang="ts">
	import { Canvas } from '@threlte/core'
	import { World } from '@threlte/rapier'
	import Scene from './Scene.svelte'
</script>

<Canvas>
	<World>
		<Scene /> <!-- Everything is happening inside this component -->
	</World>
</Canvas>

This structure ensures that all components inside the component <Scene> have access to the physics context.

Fallback

rapier is a Rust-based physics engine and as such bundled and used as a WASM module. If loading of rapier fails for any reason, a slot with the name fallback is mounted to e.g. display a fallback scene without physics.

Wrapper.svelte
<script lang="ts">
	import { Canvas } from '@threlte/core'
	import { World } from '@threlte/rapier'
	import Scene from './Scene.svelte'
	import FallbackScene from './FallbackScene.svelte'
</script>

<Canvas>
	<World>
		<Scene />
		<FallbackScene slot="fallback" />
	</World>
</Canvas>

Properties

Apart from gravity, all props are used to initialize the world and thus are not reactive.

// optional
gravity: Position | undefined = { y: -9.81 }
rawIntegrationParameters: RawIntegrationParameters | undefined = undefind
rawIslands: RawIslandManager | undefined = undefind
rawBroadPhase: RawBroadPhase | undefined = undefind
rawNarrowPhase: RawNarrowPhase | undefined = undefind
rawBodies: RawRigidBodySet | undefined = undefind
rawColliders: RawColliderSet | undefined = undefind
rawImpulseJoints: RawImpulseJointSet | undefined = undefind
rawMultibodyJoints: RawMultibodyJointSet | undefined = undefind
rawCCDSolver: RawCCDSolver | undefined = undefind
rawQueryPipeline: RawQueryPipeline | undefined = undefind
rawPhysicsPipeline: RawPhysicsPipeline | undefined = undefind
rawSerializationPipeline: RawSerializationPipeline | undefined = undefind
rawDebugRenderPipeline: RawDebugRenderPipeline | undefined = undefind