Preface
1 Introduction
1.1 Painting and Drawing
1.2 Elements of 3D Graphics
1.3 Hardware and Software
2 Two-Dimensional Graphics
2.1 Pixels, Coordinates, and Colors
2.1.1 Pixel Coordinates
2.1.2 Real-number Coordinate Systems
2.1.3 Aspect Ratio
2.1.4 Color Models
2.2 Shapes
2.2.1 Basic Shapes
2.2.2 Stroke and Fill
2.2.3 Polygons, Curves, and Paths
2.3 Transforms
2.3.1 Viewing and Modeling
2.3.2 Translation
2.3.3 Rotation
2.3.4 Combining Transformations
2.3.5 Scaling
2.3.6 Shear
2.3.7 Window-to-Viewport
2.3.8 Matrices and Vectors
2.4 Hierarchical Modeling
2.4.1 Building Complex Objects
2.4.2 Scene Graphs
2.4.3 The Transform Stack
2.5 Java Graphics2D
2.5.1 Graphics2D
2.5.2 Shapes
2.5.3 Stroke and Fill
2.5.4 Transforms
2.5.5 BufferedImage and Pixels
2.6 HTML Canvas Graphics
2.6.1 The 2D Graphics Context
2.6.2 Shapes
2.6.3 Stroke and Fill
2.6.4 Transforms
2.6.5 Auxiliary Canvases
2.6.6 Pixel Manipulation
2.6.7 Images
2.7 SVG: A Scene Description Language
2.7.1 SVG Document Structure
2.7.2 Shapes, Styles, and Transforms
2.7.3 Polygons and Paths
2.7.4 Hierarchical Models
2.7.5 Animation
3 OpenGL 1.1: Geometry
3.1 Shapes and Colors in OpenGL 1.1
3.1.1 OpenGL Primitives
3.1.2 OpenGL Color
3.1.3 glColor and glVertex with Arrays
3.1.4 The Depth Test
3.2 3D Coordinates and Transforms
3.2.1 3D Coordinates
3.2.2 Basic 3D Transforms
3.2.3 Hierarchical Modeling
3.3 Projection and Viewing
3.3.1 Many Coordinate Systems
3.3.2 The Viewport Transformation
3.3.3 The Projection Transformation
3.3.4 The Modelview Transformation
3.3.5 A Camera Abstraction
3.4 Polygonal Meshes and glDrawArrays
3.4.1 Indexed Face Sets
3.4.2 glDrawArrays and glDrawElements
3.4.3 Data Buffers in Java
3.4.4 Display Lists and VBOs
3.5 Some Linear Algebra
3.5.1 Vectors and Vector Math
3.5.2 Matrices and Transformations
3.5.3 Homogeneous Coordinates
3.6 Using GLUT and JOGL
3.6.1 Using GLUT
3.6.2 Using JOGL
3.6.3 About glsim.js
4 OpenGL 1.1: Light and Material
4.1 Introduction to Lighting
4.1.1 Light and Material
4.1.2 Light Properties
4.1.3 Normal Vectors
4.1.4 The OpenGL 1.1 Lighting Equation
4.2 Light and Material in OpenGL 1.1
4.2.1 Working with Material
4.2.2 Defining Normal Vectors
4.2.3 Working with Lights
4.2.4 Global Lighting Properties
4.3 Image Textures
4.3.1 Texture Coordinates
4.3.2 MipMaps and Filtering
4.3.3 Texture Target and Texture Parameters
4.3.4 Texture Transformation
4.3.5 Loading a Texture from Memory
4.3.6 Texture from Color Buffer
4.3.7 Texture Objects
4.3.8 Loading Textures in C
4.3.9 Using Textures with JOGL
4.4 Lights, Camera, Action
4.4.1 Attribute Stack
4.4.2 Moving Camera
4.4.3 Moving Light
5 Three.js: A 3D Scene Graph API
5.1 Three.js Basics
5.1.1 Scene, Renderer, Camera
5.1.2 THREE.Object3D
5.1.3 Object, Geometry, Material
5.1.4 Lights
5.1.5 A Modeling Example
5.2 Building Objects
5.2.1 Polygonal Meshes and IFSs
5.2.2 Curves and Surfaces
5.2.3 Textures
5.2.4 Transforms
5.2.5 Loading Models
5.3 Other Features
5.3.1 Instanced Meshes
5.3.2 User Input
5.3.3 Shadows
5.3.4 Cubemap Textures and Skyboxes
5.3.5 Reflection and Refraction
6 Introduction to WebGL
6.1 The Programmable Pipeline
6.1.1 The WebGL Graphics Context
6.1.2 The Shader Program
6.1.3 Data Flow in the Pipeline
6.1.4 Values for Uniform Variables
6.1.5 Values for Attributes
6.1.6 Drawing a Primitive
6.1.7 WebGL 2.0: Vertex Array Objects
6.1.8 WebGL 2.0: Instanced Drawing
6.2 First Examples
6.2.1 WebGL Context Options
6.2.2 A Bit of GLSL
6.2.3 The RGB Triangle in WebGL
6.2.4 Shape Stamper
6.2.5 The POINTS Primitive
6.2.6 WebGL Error Handling
6.3 GLSL
6.3.1 Basic Types
6.3.2 Data Structures
6.3.3 Qualifiers
6.3.4 Expressions
6.3.5 Function Definitions
6.3.6 Control Structures
6.3.7 Limits
6.4 Image Textures
6.4.1 Texture Units and Texture Objects
6.4.2 Working with Images
6.4.3 More Ways to Make Textures
6.4.4 Cubemap Textures
6.4.5 A Computational Example
6.4.6 Textures in WebGL 2.0
6.5 Implementing 2D Transforms
6.5.1 Transforms in GLSL
6.5.2 Transforms in JavaScript
7 3D Graphics with WebGL
7.1 Transformations in 3D
7.1.1 About Shader Scripts
7.1.2 Introducing glMatrix
7.1.3 Transforming Coordinates
7.1.4 Transforming Normals
7.1.5 Rotation by Mouse
7.2 Lighting and Material
7.2.1 Minimal Lighting
7.2.2 Specular Reflection and Phong Shading
7.2.3 Adding Complexity
7.2.4 Two-sided Lighting
7.2.5 Moving Lights
7.2.6 Spotlights
7.2.7 Light Attenuation
7.2.8 Diskworld 2
7.3 Textures
7.3.1 Texture Transforms with glMatrix
7.3.2 Generated Texture Coordinates
7.3.3 Procedural Textures
7.3.4 Bumpmaps
7.3.5 Environment Mapping
7.4 Framebuffers
7.4.1 Framebuffer Operations
7.4.2 Render To Texture
7.4.3 Renderbuffers
7.4.4 Dynamic Cubemap Textures
7.5 WebGL Extensions
7.5.1 Anisotropic Filtering
7.5.2 Floating-Point Colors
7.5.3 Instanced Drawing in WebGL 1.0
7.5.4 Deferred Shading
7.5.5 Multiple Draw Buffers in WebGL 2.0
8 Beyond Basic 3D Graphics
8.1 Ray Tracing
8.1.1 Ray Casting
8.1.2 Recursive Ray Tracing
8.1.3 Limitations of Ray Tracing
8.2 Path Tracing
8.2.1 BSDF's
8.2.2 The Path Tracing Algorithm
A Programming Languages
A.1 The Java Programming Language
A.1.1 Basic Language Structure
A.1.2 Objects and Data Structures
A.1.3 Windows and Events
A.2 The C Programming Language
A.2.1 Language Basics
A.2.2 Pointers and Arrays
A.2.3 Data Structures
A.3 The JavaScript Programming Language
A.3.1 The Core Language
A.3.2 Arrays and Objects
A.3.3 JavaScript on Web Pages
A.3.4 Interacting with the Page
B Blender
B.1 Blender Basics
B.1.1 The 3D View
B.1.2 Adding Objects to the Scene
B.1.3 Edit Mode
B.1.4 Light, Material, and Texture
B.1.5 Saving Your Work
B.1.6 More Features
B.2 Blender Modeling
B.2.1 Text
B.2.2 Curves
B.2.3 Proportional Editing
B.2.4 Extruding Meshes
B.2.5 Mesh Modifiers
B.3 Blender Animation
B.3.1 Keyframe Animation and F-Curves
B.3.2 Tracking
B.3.3 Path Animation
B.3.4 Rendering an Animation
B.4 More on Light and Material
B.4.1 Lighting
B.4.2 Eevee versus Cycles
B.4.3 The Shader Editor
C Gimp and Inkscape
C.1 Gimp: A 2D Painting Program
C.1.1 Painting Tools
C.1.2 Selections and Paths
C.1.3 Layers
C.2 Inkscape: A 2D Drawing Program
D Listing of Sample Programs
E Glossary