Learn Three.js: Program 3D animations and visualizations for the web with JavaScript and WebGL,

Cover
Title Page
Copyright and Credits
Contributors
Table of Contents
Preface
Part 1: Getting Up and Running
Chapter 1: Creating Your First 3D Scene with Three.js
	Technical requirements
		Getting the source code
	Testing and experimenting with the examples
	Exploring the HTML structure for Three.js applications
	Rendering and viewing a 3D object
		Setting up the scene
		Adding lights
		Adding the meshes
		Adding an animation loop
		Using lil-gui to control properties and make experimenting easier
	Helper objects and util functions
	Summary
Chapter 2: The Basic Components that Make up a Three.js Application
	Creating a scene
		The basic functionality of a scene
	How geometries and meshes are related
		The properties and functions of a geometry
		Functions and attributes for meshes
	Using different cameras for different scenes
		An orthographic camera versus a perspective camera
		Looking at specific points
		Debugging what a camera looks at
	Summary
Chapter 3: Working with Light Sources in Three.js
	What lighting types are provided in Three.js?
	Working with basic lights
		THREE.AmbientLight
		THREE.SpotLight
		THREE.PointLight
		THREE.DirectionalLight
		Using the THREE.Color object
	Working with special lights
		THREE.HemisphereLight
		THREE.RectAreaLight
		THREE.LightProbe
		THREE.LensFlare
	Summary
Part 2: Working with the Three.js Core Components
Chapter 4: Working with Three.js Materials
	Understanding common material properties
		Basic properties
		Blending properties
		Advanced properties
	Starting with simple materials
		THREE.MeshBasicMaterial
		THREE.MeshDepthMaterial
		Combining materials
		THREE.MeshNormalMaterial
		Multiple materials for a single mesh
	Advanced materials
		THREE.MeshLambertMaterial
		THREE.MeshPhongMaterial
		THREE.MeshToonMaterial
		THREE.MeshStandardMaterial
		THREE.MeshPhysicalMaterial
		THREE.ShadowMaterial
		Using your own shaders with THREE.ShaderMaterial
		Customizing existing shaders with CustomShaderMaterial
	Materials you can use for a line geometry
		THREE.LineBasicMaterial
		THREE.LineDashedMaterial
	Summary
Chapter 5: Learning to Work with Geometries
	2D geometries
		THREE.PlaneGeometry
		THREE.CircleGeometry
		THREE.RingGeometry
		THREE.ShapeGeometry
	3D geometries
		THREE.BoxGeometry
		THREE.SphereGeometry
		THREE.CylinderGeometry
		THREE.ConeGeometry
		THREE.TorusGeometry
		THREE.TorusKnotGeometry
		THREE.PolyhedronGeometry
		THREE.IcosahedronGeometry
		THREE.TetrahedronGeometry
		THREE.OctahedronGeometry
		THREE.DodecahedronGeometry
	Summary
Chapter 6: Exploring Advanced Geometries
	Learning advanced geometries
		THREE.ConvexGeometry
		THREE.LatheGeometry
		BoxLineGeometry
		THREE.RoundedBoxGeometry
		TeapotGeometry
	Creating a geometry by extruding a 2D shape
		THREE.ExtrudeGeometry
		THREE.TubeGeometry
		Extruding 3D shapes from an SVG element
		THREE.ParametricGeometry
	Geometries you can use for debugging
		THREE.EdgesGeometry
		THREE.WireFrameGeometry
	Creating a 3D text mesh
		Rendering text
		Adding custom fonts
		Creating text using the Troika library
	Summary
Chapter 7: Points and Sprites
	Understanding points and sprites
	Styling particles using textures
		Drawing an image on the canvas
		Using textures to style particles
	Working with sprite maps
	Creating THREE.Points from existing geometry
	Summary
Part 3: Particle Clouds, Loading and Animating Models
Chapter 8: Creating and Loading Advanced Meshes and Geometries
	Geometry grouping and merging
		Grouping objects together
		Merging geometries
	Loading geometries from external resources
		Saving and loading in Three.js JSON format
	Importing from 3D file formats
		The OBJ and MTL formats
		Loading a gLTF model
		Showing complete LEGO models
		Loading voxel-based models
		Showing proteins from PDB
		Loading a point cloud from a PLY model
		Other loaders
	Summary
Chapter 9: Animation and Moving the Camera
	Basic animations
		Simple animations
		Selecting and moving objects
		Animating with Tween.js
	Working with the camera
		ArcballControls
		TrackBallControls
		FlyControls
		FirstPersonControls
		OrbitControls
	Morphing and skeleton animation
		Animation with morph targets
		Animation with a mixer and morph targets
		Animation using bones and skinning
	Creating animations using external models
		Using gltfLoader
		Visualizing motions captured models using fbxLoader
		Loading an animation from a Quake model
		Loading an animation from a COLLADA model
		Visualizing a skeleton with BVHLoader
	Summary
Chapter 10: Loading and Working with Textures
	Using textures in materials
		Loading a texture and applying it to a mesh
		Using a bump map to provide extra details to a mesh
		Achieving more detailed bumps and wrinkles with a normal map
		Using a displacement map to alter the position of vertices
		Adding subtle shadows with an ambient occlusion map
		Creating fake lighting using a lightmap
		Metalness and roughness maps
		Using an alpha map to create transparent models
		Using an emissive map for models that glow
		Using a specular map to determine shininess
		Creating fake reflections using an environment map
		Repeat wrapping
	Rendering to a canvas and using it as a texture
		Using the canvas as a color map
		Using the canvas as a bump map
		Using the output from a video as a texture
	Summary
Part 4: Post-Processing, Physics, and Sounds
Chapter 11: Render Postprocessing
	Setting up Three.js for postprocessing
		Creating THREE.EffectComposer
		Configuring THREE.EffectComposer for postprocessing
		Updating the render loop
	Postprocessing passes
		Simple postprocessing passes
		Showing the output of multiple renderers on the same screen
		Additional simple passes
	Advanced EffectComposer flows using masks
		Advanced pass – bokeh
		Advance pass – ambient occlusion
	Using THREE.ShaderPass for custom effects
		Simple shaders
		Blurring shaders
	Creating custom postprocessing shaders
		Custom grayscale shader
		Creating a custom bit shader
	Summary
Chapter 12: Adding Physics and Sounds to Your Scene
	Creating a basic Three.js scene with Rapier
		Setting up the world and creating the descriptions
		Rendering the scene and simulating the world
	Simulating dominos in Rapier
	Working with restitution and friction
	Rapier-supported shapes
	Using joints to limit the movement of objects
		Connecting two objects with a fixed joint
		Connecting objects with a spherical joint
		Limiting rotation with a revolute joint
		Limiting movement to a single axis with a prismatic joint
	Adding sound sources to your scene
	Summary
Chapter 13: Working with Blender and Three.js
	Exporting from Three.js and importing into Blender
	Exporting a static scene from Blender and importing it into Three.js
	Exporting an animation from Blender and importing it into Three.js
	Baking lightmaps and ambient occlusion maps in Blender
		Setting up a scene in Blender
		Adding lighting to the scene
		Baking the light textures
		Exporting the scene and importing it into Blender
		Baking an ambient occlusion map in Blender
	Custom UV modeling in Blender
	Summary
Chapter 14: Three.js Together with React, TypeScript, and Web-XR
	Using Three.js with TypeScript
	Using Three.js and React with TypeScript
	Using Three.js and React with React Three Fiber
	Three.js and VR
	Three.js and AR
	Summary
Index
Other Books You May Enjoy