WebGl基础用法

       WebGL（Web Graphics Library）是一种JavaScript API，用于在Web浏览器中呈现交互式的3D和2D图形，而无需使用插件。它基于OpenGL ES 2.0，并且被设计成与HTML5的<canvas>元素集成，使开发者可以使用GPU加速来渲染图形。

       1、初始化WebGL上下文：首先，你需要获取一个WebGL上下文。你可以通过获取一个<canvas>元素的上下文来实现，如下所示：

var canvas = document.getElementById('myCanvas');
var gl = canvas.getContext('webgl');
if (!gl) {
    console.log('WebGL not supported, falling back on experimental-webgl');
    gl = canvas.getContext('experimental-webgl');
}
if (!gl) {
    alert('Your browser does not support WebGL');
}

     2、清除画布：在绘制新的图形之前，你可能需要清除画布，可以使用以下代码：

gl.clearColor(0.0, 0.0, 0.0, 1.0); // 设置清除颜色为黑色
gl.clear(gl.COLOR_BUFFER_BIT); // 清除颜色缓冲区

      3、着色器编写：WebGL中的图形渲染