user6609337 user6609337 - 1 year ago 71
HTML Question

WebGL isn't working

The following is code I got from a tutorial:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/JavaScript">
var canvas;
var gl;
function start() {
canvas = document.getElementById("glcanvas");
initWebGL(canvas); // Initialize the GL context
// Only continue if WebGL is available and working
if (gl) {
gl.clearColor(0.0, 0.0, 0.0, 1.0); // Set clear color to black, fully opaque
gl.clearDepth(1.0); // Clear everything
gl.enable(gl.DEPTH_TEST); // Enable depth testing
gl.depthFunc(gl.LEQUAL); // Near things obscure far things
function initWebGL() {
gl = null;
try {
gl = canvas.getContext("experimental-webgl");
catch(e) {
// If we don't have a GL context, give up now
if (!gl) {
alert("Unable to initialize WebGL. Your browser may not support it.");

<body onload="start()">
<canvas id="glcanvas" width="640" height="480">
Your browser doesn't appear to support the <code>&lt;canvas&gt;</code> element.

A black box should show up, but I just get a plain white screen. The alert does show up. I am using firefox and webgl-force:enabled is set to true in about:config. Why won't the black box show up?

Answer Source

You're missing

// Clear the color as well as the depth buffer.

at the end of your gl calls


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download