WebGL不起作用

时间:2016-07-28 18:29:36

标签: javascript html webgl

以下是我从教程中获得的代码:

<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) {
      alert("works");
      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.");
    }
  }
</script>


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

应该出现一个黑匣子,但我只是得到一个纯白色的屏幕。警报确实显示出来。我正在使用firefox和webgl-force:在about:config中将enabled设置为true。为什么黑箱出现了?

1 个答案:

答案 0 :(得分:3)

你错过了

// Clear the color as well as the depth buffer.
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
在你的电话结束时

source