绘图
WebGL只能绘制三种形状,点,线,和三角,执行操作绘图要调用gl.drawArrays()或gl.drawElements()方法,第一个参数都是一个常量,表示要绘制的形状
gl.POINTS:将每个顶点当成一个点来绘制
gl.LINES:将数组当成一系列顶点,在这些顶点间画线。
gl.LINE_LOOP:绘制一条直线到下一个顶点,并将最后一个顶点连接到第一个顶点。
gl.LINE_STRIP:绘制一条直线到下一个顶点。
gl.TRIANGLES:将数组当成一系列顶点,在这些顶点间绘制三角形。
//假设已经使用了前面的代码
var vertices=new Float32Array([0,1,1,-1,-1,-1]);
var buffer=gl.createBuffer();//创建缓冲区
var vertexSetSize=2;//顶点集合大小
var vertexSetCoun=vertices.length/vertexSetSize;
//把数据放到缓冲区
gl.bindBuffer(gl.ARRAY_BUFFER,buffer)
gl.bufferData(gl.ARRAY_BUFFER,vertices,gl.STATIC_DRAW);
//为片段着色器传入颜色值
var color=gl.getUniformLocation(program,“color”);
gl.linkProgram(program)
gl.uniform4fv(color,[0,0,0,1]);
//为着色器传入顶点信息
var a=gl.getAttribLocation(program,“a”);
gl.enableVertexAttribArray(a);
gl.vertexAttribPointer(a,vertexSetSize,gl.FLOAT,false,0,0);
//绘制三角形
gl.drawArrays(gl.TRIANGLES,0,vertexSetCoun);
讲到这里Webgl就讲完了,专门讲解这门语言的书有很多,我只是负责简要介绍下该语言,WebGl只适合实验性的学习,不适合真正开发使用
更多山东编程培训相关资讯,请扫描下方二维码