Three.js

Crea entornos 3D interactivos en tu navegador

Sonia Ruiz

👩🏻‍💻 Frontend Developer en Secuoyas

@Yune__vk YuneVK

Web Graphics Library

¡+300 líneas! 😱

Three.js

Ricardo Cabello

Ricardo Cabello (Mr.Doob)

Three.js

Código Three.js

Fundamentos 3D

Esquema escenario 3D
Esquema escenario 3D Ejemplo modelo 3D
Esquema escenario 3D
Código Three.js
Código Three.js
Código Three.js
Código Three.js
Código Three.js
Código Three.js
Código Three.js
Esquema escenario 3D

Elementos

Escena

Código Three.js

Cámara

Tipos de cámara

Tipos de cámara

Código Three.js
Código Three.js

Controls

Código Three.js

Renderer

Código Three.js
Código Three.js

Objetos (Mesh)

Esquema escenario 3D Ejemplo modelo 3D
Código Three.js
Código Three.js
Código Three.js

Configurar material

Código Three.js

Cargar modelos

Código Three.js

Luces

Hemisphere light

Código Three.js

Point light

Código Three.js

Directional light

Código Three.js

Interacción

Código Three.js

¡Aún hay más!

Shaders

Más info

AR/VR/XR

Más info

Credits

¡Muchas gracias!

@Yune__vk YuneVK