Three.js Essentials -- Table of Contents -- Three.js Essentials -- Credits -- About the Author -- Acknowledgment -- About the Reviewers -- www.PacktPub.com -- Support files, eBooks, discount offers, and more -- Why subscribe? -- Free access for Packt account holders -- Preface -- What this book covers -- What you need for this book -- Who this book is for -- Conventions -- Reader feedback -- Customer support -- Downloading the example code -- Downloading the color images of this book -- Errata -- Piracy -- Questions -- 1. Get Up and Running with Three.js -- Introducing Three.js -- Looking at the requirements for Three.js -- Setting up a local development environment -- Getting the source code -- Setting up a local web server -- Using Python to run a web server -- Using the npm command from Node.js to run a web server -- Running a portable version of Mongoose -- Creating a minimal Three.js web application -- Creating a scene to contain all the objects -- Adding a mesh created from geometry -- What are vertices? -- Combining vertices into faces -- Enhancing the basic scene -- Adding easy controls with the dat.GUI library -- Add a statistics element to show the frame rate -- Debugging the examples in this book -- Using console logging for debugging -- Looking at objects with breakpoints in Chrome -- Summary -- 2. Creating a 3D World Globe and Visualizing Open Data -- Setting up the globe and camera controls -- Adding basic textures to the globe -- Adding directional and ambient lighting -- Combining with a starry background -- Improving the look with more advanced textures -- Using a normal map to simulate elevations -- Using a specular map to define the reflectivity of an area -- Adding 2D information using HTML canvas as a texture -- Summary -- 3. Navigate around a Randomly Generated Maze -- The result we're aiming for in this chapter.

Creating the maze -- Generating a maze layout -- Converting the layout to a 3D set of objects -- Animating the cube -- The standard Three.js rotation behavior -- Creating an edge rotation using matrix-based transformation -- Using Tween.js to add an animation -- Setting up collision detection -- Selecting objects -- Detecting collisions -- Adding textures and improving the lighting -- Adding a repeating texture -- Setting up the light sources -- Adding trackball and keyboard controls -- Adding trackball controls to the camera -- Configuring keyboard controls -- Summary -- 4. Visualizing Audio Data with a Particle System -- Visualizing the audio volume -- Setting up the HTML5 Web Audio API -- Creating a particle system -- Playing a sound and animating the particle system -- Creating a particle system by hand -- Web Audio's configuration and the render loop -- Creating waves with a custom geometry -- Customizing colors of individual particles -- Coloring individual particles -- Coloring the particles based on the amplitude -- Combining dynamic colors to create advanced visualizations -- Setting up the initial particle system -- Calculating volumes for each range -- Determining particles that need to be updated and setting the height and color of an individual particle -- Summary -- 5. Programmatic Geometries -- Creating a 3D terrain from scratch -- Generating a terrain with Math.random() -- Generating a terrain with a Perlin noise -- Adding a texture -- Creating a JavaScript object with a constructor -- Creating a city from scratch -- Creating parametric trees -- Summary -- 6. Combining HTML and Three.js with CSS3DRenderer -- Setting up a CSS3DRenderer skeleton -- Creating an interactive 3D Google Maps cube -- Displaying a part of Google Maps using HTML -- Positioning and rotating the element -- Animating HTML elements with TweenJS.

Using images as the input -- Setting up the animations -- Determining the target position and rotation -- Configuring TweenJS to run the animation -- Creating a parametric terrain using CSS sprites -- Creating a 3D terrain using sprites -- Animating the terrain with TweenJS -- Summary -- 7. Loading and Animating External Models Using Blender -- Installing Blender and the Three.js plugin -- Downloading and installing Blender -- Installing the Three.js plugin -- Enabling the Three.js plugin -- Exporting a model from Blender and showing it in Three.js -- Exporting the model -- Loading the model and showing it in Three.js -- Using Blender's predefined materials in Three.js -- Setting up a Blender material -- Setting up UV mapping in Blender -- Exporting and rendering in Three.js -- Working with skeletal-based animations in Three.js -- Exploring the model and exporting it to Three.js -- Loading and animating the model in Three.js -- Working with morph-based animations in Three.js -- Exploring the model and exporting it to Three.js -- Loading and animating the model in Three.js -- Summary -- Index.