Learning Three.js : programming 3D animations and visualizations for the web with HTML5 and WebGL

Title Page
Cover
Copyright and Credits
PacktPub.com
Contributors
Table of Contents
Preface
Chapter 1: Creating Your First 3D Scene with Three.js
	Requirements for using Three.js
	Getting the source code
		Using Git to clone the repository
		Downloading and extracting the archive
		Testing the examples
			Python-based web servers should work on most Unix/macOS systems
			Npm-based web server if you\'ve worked with Node.js
			Portable version Mongoose for macOS and/or Windows
			Running from the filesystem by disabling security exceptions in Firefox and Chrome
	Creating the HTML skeleton
	Rendering and viewing a 3D object
	Adding materials, lights, and shadows
	Expanding your first scene with animations
		Introducing requestAnimationFrame
		Animating the cube
		Bouncing the ball
	Using dat.GUI to make experimenting easier
	Automatically resize the output when the browser size changes
	Summary
Chapter 2: The Basic Components that Make Up a Three.js Application
	Creating a scene
		The basic functionality of a scene
		Adding fog to the scene
		Using the overrideMaterial property
	Geometries and meshes
		The properties and functions of a geometry
		Functions and attributes for meshes
	Different cameras for different uses
		Orthographic camera versus perspective camera
		Looking at specific points
	Summary
Chapter 3: Working with Light Sources in Three.js
	The different kinds of lighting provided by Three.js
	Basic lights
		THREE.AmbientLight
			Using the THREE.Color object
		THREE.SpotLight
		THREE.PointLight
		THREE.DirectionalLight
	Special lights
		THREE.HemisphereLight
		THREE.AreaLight
		Lens flare
	Summary
Chapter 4: Working with Three.js Materials
	Understanding common material properties
		Basic properties
		Blending properties
		Advanced properties
	Starting with a simple mesh
		THREE.MeshBasicMaterial
		THREE.MeshDepthMaterial
		Combining materials
		THREE.MeshNormalMaterial
		Multiple materials for a single mesh
	Advanced materials
		THREE.MeshLambertMaterial
		THREE.MeshPhongMaterial
		THREE.MeshStandardMaterial
		THREE.MeshPhysicalMaterial
		Creating your own shaders with THREE.ShaderMaterial
	Materials you can use for a line geometry
		THREE.LineBasicMaterial
		THREE.LineDashedMaterial
	Summary
Chapter 5: Learning to Work with Geometries
	The basic geometries provided by Three.js
		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: Advanced Geometries and Binary Operations
	THREE.ConvexGeometry
	THREE.LatheGeometry
	Creating a geometry by extruding
		THREE.ExtrudeGeometry
		THREE.TubeGeometry
		Extruding from SVG
	THREE.ParametricGeometry
	Creating 3D text
		Rendering text
		Adding custom fonts
	Using binary operations to combine meshes
		The subtract function
		The intersect function
		The union function
	Summary
Chapter 7: Points and Sprites
	Understanding points
	THREE.Points and THREE.PointsMaterial
		Styling particles with the HTML5 canvas
			Using HTML5 canvas with THREE.CanvasRenderer
			Using HTML5 canvas with WebGLRenderer
		Using textures to style particles
	Working with sprite maps
	Creating THREE.Points from an advanced geometry
	Summary
Chapter 8: Creating and Loading Advanced Meshes and Geometries
	Geometry grouping and merging
		Grouping objects together
		Merging multiple meshes into a single mesh
	Loading geometries from external resources
		Saving and loading in Three.js JSON format
		Saving and loading THREE.Mesh
		Saving and loading a scene
		Working with Blender
			Installing the Three.js exporter in Blender
			Loading and exporting a model from Blender
	Importing from 3D file formats
		The OBJ and MTL formats
		Loading a COLLADA model
		Loading models from other supported formats
		Show proteins from PDB
		Creating a particle system from a PLY model
	Summary
Chapter 9: Animations and Moving the Camera
	Basic animations
		Simple animations
		Selecting objects
		Animating with Tween.js
	Working with the camera
		TrackballControls
		FlyControls
		FirstPersonControls
		OrbitControl
	Morphing and skeletal animation
		Animation with morph targets
		Animation with a mixer and morph targets
		Using multiple THREE.AnimationClip objects
		Animation using bones and skinning
	Creating animations using external models
		Creating a bones animation using Blender
		Loading an animation from a COLLADA model
		Animation loaded from a Quake model
		Using the gltfLoader
		Visualize motions captured models using the fbxLoader
		Loading legacy DirectX models through the xLoader
		Visualizing a skeleton with the BVHLoader
		Reusing models from the SEA3D project
	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 create wrinkles
		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 shadows using a lightmap
		Metalness and roughness maps
		Alpha map
		Emissive map
		Specular map
		Creating fake reflections using an environment map
	Advanced usage of textures
		Custom UV mapping
		Repeat wrapping
	Rendering to a canvas and using it as a texture
		Using the canvas as a texture
		Using the canvas as a bump map
	Using the output from a video as a texture
	Summary
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
			Using THREE.FilmPass to create a TV-like effect
			Adding a bloom effect to the scene with THREE.BloomPass
			Output the scene as a set of dots
			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 physics
	Physi.js material properties
	Physi.js supported shapes
	Using constraints to limit the movement of objects
		Using PointConstraint to limit movement between two points
		Hinge constraints
		Limiting movement to a single axis with SliderConstraint
		Creating a ball-and-socket-joint-like constraint with ConeTwistConstraint
		Creating detailed control with DOFConstraint
	Add sound sources to your scene
	Summary
Other Books You May Enjoy
Index