Repolode
Enviar
pmndrs

pmndrs/react-three-rapier

Bindings de React para el motor de física Rapier WASM, que integra cuerpos rígidos, colliders y joints en escenas de react-three-fiber.

Ver en GitHubSitio web
Estrellas
1,475
Forks
89
Issues abiertos
55
Último commit
hace 8 días

¿Qué es?

react-three/rapier integra el motor de física Rapier WASM mediante componentes de React, para que los objetos físicos se puedan declarar junto a las meshes en una escena de react-three-fiber. El componente Physics crea la simulación, los componentes RigidBody vinculan meshes a ella y los componentes collider definen formas manualmente o las generan automáticamente a partir de la geometría de las meshes.

Además de los cuerpos básicos, la biblioteca ofrece hooks para joints fijos, esféricos, revolutos, prismáticos, de cuerda y de resorte, así como cuerpos rígidos instanciados para manejar grandes cantidades de meshes. También incluye eventos de colisión y fuerza de contacto, sensores, filtros por grupos de colisión, pasos de tiempo configurables, un renderizador de depuración, bucles de actualización independientes para el renderizado bajo demanda y snapshots del mundo.

La versión 2 del paquete está dirigida a react-three-fiber v9 y React 19; los proyectos que usan React 18 deben usar la versión 1 con fiber v8.

Funciones clave

  • 01Componentes declarativos RigidBody y collider para escenas de react-three-fiber.
  • 02Generación automática de colliders a partir de los límites de una mesh, esferas o geometría de convex hull y trimesh.
  • 03Seis tipos de joint disponibles mediante hooks de React, incluidos los joints revolutos, prismáticos y de resorte.
  • 04Cuerpos rígidos instanciados con colliders por instancia y formas compuestas.
  • 05Callbacks para eventos de colisión, sensores y fuerza de contacto, además de filtros por grupos de colisión.
  • 06Visualización de depuración, paso de tiempo configurable y serialización de snapshots del mundo.

Casos de uso

  • Añadir objetos controlados por la física, como elementos que caen o pelotas que rebotan, a un juego o una escena interactiva de react-three-fiber.
  • Crear ragdolls, cadenas, puertas o ruedas con joints en una aplicación 3D de React.
  • Simular miles de cuerpos rígidos pequeños mediante meshes instanciadas.
  • Detectar zonas o activadores en una escena 3D mediante colliders de sensor.

Inicio rápido

  1. 1

    Instala el paquete desde npm

    npm install @react-three/rapier
  2. 2

    Importa Physics y RigidBody, y envuelve tu escena en Physics dentro de Suspense

Antes de usarlo

  • La versión 2 requiere @react-three/fiber v9 y React v19; quienes usen React v18 deben usar la versión 1 con fiber v8.

Temas

#physics#react#three-js#webgl#rapier#game-development#3d

Preguntas frecuentes

¿Qué es react-three-rapier?
Bindings de React para el motor de física Rapier WASM, que integra cuerpos rígidos, colliders y joints en escenas de react-three-fiber. react-three/rapier integra el motor de física Rapier WASM mediante componentes de React, para que los objetos físicos se puedan declarar junto a las meshes en una escena de react-three-fiber. El componente Physics crea la simulación, los componentes RigidBody vinculan meshes a ella y los componentes collider definen formas manualmente o las generan automáticamente a partir de la geometría de las meshes.
¿react-three-rapier es gratuito? ¿Qué licencia tiene?
react-three-rapier es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿react-three-rapier sigue mantenido?
Mantenimiento activo. El último commit de react-three-rapier fue el 12 oct 2026.
¿Para qué puedo usar react-three-rapier?
Añadir objetos controlados por la física, como elementos que caen o pelotas que rebotan, a un juego o una escena interactiva de react-three-fiber. Crear ragdolls, cadenas, puertas o ruedas con joints en una aplicación 3D de React. Simular miles de cuerpos rígidos pequeños mediante meshes instanciadas. Detectar zonas o activadores en una escena 3D mediante colliders de sensor.
¿Cómo se instala react-three-rapier?
Instala el paquete desde npm: npm install @react-three/rapier Importa Physics y RigidBody, y envuelve tu escena en Physics dentro de Suspense
¿Dónde consigo react-three-rapier?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/pmndrs/react-three-rapier

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados