Joints

Simple and declarative way to joint two or more rigidBodies.

Joints is an extension feature provided in Rapier#Joint. It lets us connect two or more bodies, restricting their movements according to each other.

In TresJs we can achieve such motion restriction by using the available joint components:

Joint component	Rapier equivalent	Description
`<GenericJoint />`	Generic joint	Low-level configurable joint used to compose custom constraints and advanced DOF combinations.
`<PrismaticJoint />`	Prismatic joint	Allows only relative translation along one axis (sliding motion).
`<RevoluteJoint />`	Revolute joint	Allows only relative rotation around one axis (hinge motion).
`<RopeJoint />`	Rope joint	Limits the maximum distance between two anchors, like a rope/cable constraint.
`<SphericalJoint />`	Spherical joint	Keeps two anchor points together while allowing free relative rotation (ball-and-socket).
`<SpringJoint />`	Spring joint	Connects two bodies with spring behavior using stiffness and damping.

All of them extend BaseJoint.

How to use

Here's a basic Joints implementation in TresJs:

<script setup lang="ts">
import { RigidBody, SphericalJoint } from '@tresjs/rapier'
import { shallowRef } from 'vue'

const bodyRefA = shallowRef(null)
const bodyRefB = shallowRef(null)
</script>

<template>
  <RigidBody
    ref="bodyRefA"
    type="kinematic"
    :position="[0, 0, 0]"
    collider="ball"
  >
    <TresMesh>
      <TresSphereGeometry />
      <TresMeshNormalMaterial />
    </TresMesh>
  </RigidBody>

  <RigidBody
    ref="bodyRefB"
    :position="[-2.2, 0, 0]"
    collider="ball"
  >
    <TresMesh>
      <TresSphereGeometry />
      <TresMeshNormalMaterial />
    </TresMesh>
  </RigidBody>

  <SphericalJoint
    :bodies="[bodyRefA?.instance, bodyRefB?.instance]"
    :params="[
      [0, -1.1, 0],
      [0, 2, 0],
    ]"
  />
</template>

In the above example, we created two RigidBody references, then, we implemented the SphericalJoint component, by placing our two RigidBody references in the :bodies property and specifying parameters, we created a spherical-joint between them.

For more info please take a look at the official Joint Documentation also don't forget to check Joint constrains.

Props

type

JointType

Joint type to create.

bodies

[RigidBody, RigidBody]

Two rigid bodies connected by the joint.

params

number | number[]

Joint parameters passed to Rapier joint data.

wakeUpOnChanges

boolean

Default: true - Wakes up connected bodies when the joint mounts, unmounts, or updates.

Instance rigid body

Simulate many repeated objects efficiently by creating one Rapier rigid body per instance of a TresInstancedMesh.

UseRapier

Composable more advance physics world manipulation.

Joints

How to use

Explanation

Props