WebGL通过getAttribLocation向顶点坐标器传递信息

<canvas style="border: red solid 3px;" id=‘webgl‘ width=‘500‘ height=‘500‘>不支持</canvas>
<script>
    //顶点着色器程序
    var VSH =
        attribute vec4 a_Position;n +
        attribute float a_PointSize;n +
        void main(){n +
            gl_Position = a_Position;n + //坐标
            gl_PointSize = a_PointSize;n + //尺寸
        }n;

    //片元着色器程序
    var FSH =
        void main(){n +
            gl_FragColor = vec4(1.0,0.5,0.9,1.0);n + //颜色
        }n;



    var canvas = document.getElementById(webgl);
    var gl = getWebGLContext(canvas);
    initShaders(gl, VSH, FSH); //初始化着色器

    var a_Position = gl.getAttribLocation(gl.program, a_Position); //获取attribute -> a_Position变量的存储地址
    gl.vertexAttrib3f(a_Position, 0.5, 0.0, 0.0);    //将顶点的位置传给attribute变量

    var a_PointSize = gl.getAttribLocation(gl.program, a_PointSize); //获取attribute -> a_PointSize变量的存储地址
    gl.vertexAttrib1f(a_PointSize, 150.0);    //将顶点的位置传给attribute变量

    gl.clearColor(0.0, 0.0, 1.0, 1.0); //指定背景色
    gl.clear(gl.COLOR_BUFFER_BIT); //填充
    gl.drawArrays(gl.POINTS, 0, 1); //绘制一个点
    /*
        因为绘制的是单独的点,所以是gl.POINTS
        第二个参数为0,表示从第一个顶点画起
        第三个参数为1,表示在程序中只绘制了一个点
    */

</script>

 

WebGL通过getAttribLocation向顶点坐标器传递信息