Book Image

WebGL Beginner's Guide

Book Image

WebGL Beginner's Guide

Overview of this book

WebGL is a new web technology that brings hardware-accelerated 3D graphics to the browser without installing additional software. As WebGL is based on OpenGL and brings in a new concept of 3D graphics programming to web development, it may seem unfamiliar to even experienced Web developers.Packed with many examples, this book shows how WebGL can be easy to learn despite its unfriendly appearance. Each chapter addresses one of the important aspects of 3D graphics programming and presents different alternatives for its implementation. The topics are always associated with exercises that will allow the reader to put the concepts to the test in an immediate manner.WebGL Beginner's Guide presents a clear road map to learning WebGL. Each chapter starts with a summary of the learning goals for the chapter, followed by a detailed description of each topic. The book offers example-rich, up-to-date introductions to a wide range of essential WebGL topics, including drawing, color, texture, transformations, framebuffers, light, surfaces, geometry, and more. With each chapter, you will "level up"ù your 3D graphics programming skills. This book will become your trustworthy companion filled with the information required to develop cool-looking 3D web applications with WebGL and JavaScript.
Table of Contents (18 chapters)
WebGL Beginner's Guide
Credits
About the Authors
Acknowledgement
About the Reviewers
www.PacktPub.com
Preface
Index

Use of color in the scene


It is time to discuss transparency and alpha blending. We mentioned before that the alpha channel can carry information about the opacity of the color with which the object is being painted. However, as we saw in the cube example, it is not possible to obtain a translucent object unless alpha blending is activated. Things get a bit more complicated when we have several objects in the scene. We will see here what to do in order to have a consistent scene when we have translucent and opaque objects.

Transparency

The first approach to obtain transparent objects is to use polygon stippling. This technique consists of discarding some fragments so you can see through the object. Think of it as punching little holes throughout the surface of your object.

OpenGL supports polygon stippling through the glPolygonStipple function. This function is not available in WebGL. You could try to replicate this functionality by dropping some fragments in the fragment shader using the...