SketchpunkLabs | Fun with WebGL 2.0 : 017 : Terrains & TriangleStrips @SketchpunkLabs | Uploaded 7 years ago | Updated 1 day ago
Today we learn how to use the triangle_strip drawmode to connect the dots of a grid of vertices to create a plane. With the help of perlin noise we turn the flat plane into a hilly terrain then finish it off by putting together a simple shader to apply basic lighting to make it easier to visually see the curvatures of our terrain. We finish it off by using some shader code found online to create a low-poly like diffuse coloring of our terrain.
================================================
Javascript 2D Perlin & Simplex noise functions
https://github.com/josephg/noisejs
OpenGL - How to calculate normals in a terrain height grid?
http://stackoverflow.com/questions/13983189/opengl-how-to-calculate-normals-in-a-terrain-height-grid
An introduction to shader derivative functions (Low Poly)
http://www.aclockworkberry.com/shader-derivative-functions/
================================================
GitHub :: https://github.com/sketchpunk/FunWithWebGL2
Patreon :: https://www.patreon.com/sketchpunk
Tumblr :: http://sketchpunklabs.tumblr.com/
Today we learn how to use the triangle_strip drawmode to connect the dots of a grid of vertices to create a plane. With the help of perlin noise we turn the flat plane into a hilly terrain then finish it off by putting together a simple shader to apply basic lighting to make it easier to visually see the curvatures of our terrain. We finish it off by using some shader code found online to create a low-poly like diffuse coloring of our terrain.
================================================
Javascript 2D Perlin & Simplex noise functions
https://github.com/josephg/noisejs
OpenGL - How to calculate normals in a terrain height grid?
http://stackoverflow.com/questions/13983189/opengl-how-to-calculate-normals-in-a-terrain-height-grid
An introduction to shader derivative functions (Low Poly)
http://www.aclockworkberry.com/shader-derivative-functions/
================================================
GitHub :: https://github.com/sketchpunk/FunWithWebGL2
Patreon :: https://www.patreon.com/sketchpunk
Tumblr :: http://sketchpunklabs.tumblr.com/