graphics-snippets

“You should name a variable using the same care with which you name a first-born child.”
Robert C. Martin, Clean Code: A Handbook of Agile Software Craftsmanship

WebGL Examples

Hello Triangle

Hello Triangle - Node.js, WebGL 1.0
Hello Triangle - Node.js, WebGL 2.0

Geometry

Displacement - vertex displacement on tessellated mesh

App

Tools

Light Model - property transitions

Height Map Generator

Function Plotter

Normal and Parallax Mapping

Offset Limiting

Steep Parallax Mapping

Parallax Occlusion Mapping

Cone Step Mapping

Comparison of different “bump” mapping techniques

Ambient occlusion

SSAO (Screen Space Ambient Occlusion)

Special

Sketch

StackOverflow examples

Simple fixed SSAO

SSAO - random noise and kernel

Simple blur - Blur cube

Lambertian diffuse sphere

Lambertian diffuse fake light

Gouraud shading / Phong shading

Phong light model / Blinn Phong light model

Parallax textured cube

Cube - glMatrix

Translation and rotation

Model View Projection

Unproject 2D - Screen coordinate to world

Unproject perspective - Intersect world by line of sight

Spherical projection

Saturate texture

Cylindrical projected texture

Retro distortion

Texture flashlight

Toon silhouette

Voronoi triangles