Cargando…
Three.js essentials : create and animate beautiful 3D graphics with this fast-paced tutorial /
This book is an easy-to-follow guide that shows the essential parts of Three.js through a set of extensive examples. Through the explanation of these examples, you'll learn everything you need to know about Three.js. If you already know JavaScript and want to quickly learn the essentials of Thr...
| Clasificación: | Libro Electrónico |
|---|---|
| Autor principal: | |
| Formato: | Electrónico eBook |
| Idioma: | Inglés |
| Publicado: |
Birmingham, UK :
Packt Pub.,
2014.
|
| Colección: | Community experience distilled.
|
| Temas: | |
| Acceso en línea: | Texto completo |
Tabla de Contenidos:
- Cover; Copyright; Credits; About the Author; Acknowledgment; About the Reviewers; www.PacktPub.com; Table of Contents; Preface; Chapter 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; Chapter 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 elevationsUsing a specular map to define the reflectivity of an area; Adding 2D information using HTML canvas as a texture; Summary; Chapter 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 lightingAdding a repeating texture; Setting up the light sources; Adding trackball and keyboard controls; Adding trackball controls to the camera; Configuring keyboard controls; Summary; Chapter 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 particlesColoring 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; Chapter 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 constructor; Creating a city from scratch.