WebGL Shaders
Examples
See GLSL shaders in action for an old version of the Kindle book, Seven Simple Shaders
.
The list below includes most of the shader examples, with source
code.
See projects for the newer, interactive,
Simple Shaders: Learn WebGL Book 4
.
Shaders Examples, Source & Graphics
GLSL Examples
GLSL Balloon Effect: WebGL GLSL Balloon Effect: WebGL Shader, Map Bulge Effect: WebGL Animated Radiating Colors: WebGL Animated Radiating Colors: WebGL Shader Interactive Cloud Travel: WebGL Cloud Depth Animation: WebGL Interactive Cloud Travel: WebGL Shader Color Filters: WebGL Color Filters: WebGL Shader Cube Color Animation: WebGL Cube Color Animation: WebGL Shader Fade Colors GLSL: WebGL Fade Colors GLSL: WebGL Shader Animated Fish & Water: WebGL Animated Fish & Water: WebGL Maps, Water Tips Lighthouse & Clouds: WebGL Lighthouse & Cloud: WebGL Shaders, Maps Multiply Geometric Shapes: WebGL Multiply Geometric Shapes: Maps, WebGL Shaders Shrinking Octagon: WebGL Shrinking Octagon: WebGL GLSL Shader Spotlight Effect GLSL Spotlight: WebGL Shader, Map Zoom In: WebGL Lighthouse Zoom In: WebGL Lighthouse Zoom In: WebGL Shader Zoom Out Concentric Circles: WebGL Zoom Out Concentric Circles: WebGL ShaderSimple Shaders: Learn WebGL Book 4
Learn the basics of WebGL shader programming withSimple Shaders: Learn WebGL Book 4. This book covers seven projects with unique shaders, in detail, providing an overview of GLSL (OpenGL Shading Language), which is the shader language used for WebGL. See the following projects online
Spotlight Across Text, Radiating Colors, Cube Vertex Colors, Color Filters, Zoom Shader, Spotted Balloon Burstsand
Colors Fade. Most shaders activate as you swipe over the canvas. See various visual effects including color animation, zooming, color filters, a traveling spotlight and expanding mesh.
Simple Shaders
explains how to prepare basic WebGL GLSL shaders.
This new Kindle book includes detailed instruction and links to many interesting
WebGL shader examples online.
Learn to program WebGL shaders. Harness the power of the Graphics Processing Unit (GPU).
