webgl编程指南学习，传递坐标
这个例子也有错误，本来是program,却写成了gl.program,故更改，上代码。吐槽下，翻译的大哥们，认真点不好么？
<html>
<head>11</head>
<body>
<canvas id = "test" width = "200" height = "200">canvas </canvas>
<script >
//顶点着色器
var vertexShaderSource =
'attribute vec4 a_Position;\n' +
'void main() {\n' +
'gl_Position = a_Position;\n'+ //设置坐标
'gl_PointSize = 10.0;\n' + //设置尺寸
'}\n';
//片元着色器
var fragmentShaderSource =
'void main() {\n' +
'gl_FragColor = vec4(0.0, 1.0, 0.0,1.0);\n'+ //设置颜色
'}\n';
//创建着色器方法，输入参数：渲染上下文，着色器类型，数据源
function createShader(gl, type, source)
{
//创建着色器对象
var shader = gl.createShader(type);
//提供数据源
gl.shaderSource(shader,source);
//编译着色器
gl.compileShader(shader);
//链接
var success = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
if(success)
{
return shader;
}
console.log(gl.getShaderInfoLog(shader));
gl.deleteShader(shader);
}
//将顶点着色器和像素着色器链接到一个着色程序
function createProgram(gl, vertexShader, fragmentShader)
{
var program = gl.createProgram();
gl.attachShader( program, vertexShader);
gl.attachShader( program, fragmentShader);
gl.linkProgram( program );
var success = gl.getProgramParameter(program, gl.LINK_STATUS);
if(success)
{
console.log("link right");
return program;
}
console.log(gl.getProgramInfoLog(program));
gl.deleteProgram(program);
}
var canvas = document.getElementById("test");
//创建webgl渲染上下文
var gl = canvas.getContext("webgl");
//var gl = WebGLUtils.setupWebGL(canvas);
if(!gl)
{
console.log("wrong");
}
else
{
console.log("right");
}
//初始化着色器
var vertexShader = createShader(gl,gl.VERTEX_SHADER,vertexShaderSource);
var fragmentShader = createShader(gl,gl.FRAGMENT_SHADER, fragmentShaderSource);
var program = createProgram(gl, vertexShader, fragmentShader);
gl.useProgram(program);
//获取位置变量
var thePosition = gl.getAttribLocation(program, 'a_Position');
//if(thePosition < 0 )
//{
// console.log('failed to get the storage location of a_Position');
//}
//传递顶点位置
gl.vertexAttrib3f(thePosition, 0.0, 0.0, 0.0);
//清除颜色
gl.clearColor(0.0,0.0,0.0,1.0);
gl.clear(gl.COLOR_BUFFER_BIT);
//绘制点
gl.drawArrays(gl.POINTS, 0, 1);
</script>
</body>
</html>