WebGL Beginner's Guide

Time for action – accessing the WebGL context

We are going to modify the previous example to add a JavaScript function that is going to check the WebGL availability in your browser (trying to get a handle). This function is going to be called when the page is loaded. For this, we will use the standard DOM onLoad event.

1. Open the file ch1_Canvas.html in your favorite text editor (a text editor that highlight HTML/JavaScript syntax is ideal).
2. Add the following code right below the </style> tag:

   <script> var gl = null; function getGLContext(){ var canvas = document.getElementById("canvas-element-id"); if (canvas == null){ alert("there is no canvas on this page"); return; } var names = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"]; for (var ...