WebGL坐标系统以及存储限定符

2020-03-20 13:02:03 阅读：217 来源： 互联网

标签：限定符变量 attribute WebGL 坐标 0.0 var Position gl

WebGL:笛卡尔坐标系

面向屏幕时：右手坐标系

<canvas>坐标系
attribute变量，传输和顶点相关的变量

在顶点着色器中声明attribute
将attribute变量赋值给gl_Position变量
想attribute传输数据

var VSHADER_SOURCE=
    'attribute vec4 a_Position;\n'+
    'void main(){\n'+
    'gl_Position=a_Position;\n'+
    'gl_PointSize=10.0;\n'+
'}\n';


var FSHADER_SOURCE=
    'void main(){\n'+
    'gl_FragColor=vec4(1.0,0.0,0.0,1.0);\n'+
    '}\n';

function main(){
    var canvas=document.getElementById("webgl");

    var gl=getWebGLContext(canvas);

    if(!initialShaders(gl,VSHADER_SOURCE,FSHADER_SOURCE))
    {
        Console.log("Failed to initailal shader");
        return 
    }
    var  a_Position=gl.getAttribLocation(gl.program,'a_Position');

    if(a_Position<0)
    {
        console.log("Failed to get the storage location of a_Position");
        return
    }

    gl.vertexAttrib3f(a_Position,0.0,0.0,1.0);

    gl.clearColor(0.0,0.0,0.0,1.0);
    gl.clear(gl.COLOR_BUFFER_BIT);

    gl.drawArrays(gl.POINTS,0,1);
}

attribute称为存储限定符，表示接下来的变量是一个attribute变量，且为全局变量。

变量声明：attribute vec4 a_Position

　　　　gl_Position=a_Position

　　　2.获取attribute 变量的存储位置(第二个参数是attribe 修饰的变量的名称)返回attribute的存储位置

　　　　var a_Position=gl.getAttribLocation(gl.program,'a_Position');//此处的gl.program是由initShader()函数创建的

　　　3.使用位置向着色器传入值，使用gl.vertexAttrib3f()函数,（第一个参数是location,后面参数是坐标）

　　　　　gl.vertexAttrib3f(a_Position,0.0,0.0,0.0);

这样做就可以通过javascript代码把坐标位置动态传给着色器，而不用写死在顶点着色器中。

除了有 gl.vertexAttrib3f还有gl.vertexAttrib1f,2f,3f

标签：限定符,变量,attribute,WebGL,坐标,0.0,var,Position,gl
来源： https://www.cnblogs.com/1521681359qqcom/p/12526790.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

WebGL坐标系统以及存储限定符