I'm learning WebGL following a tutorial in the WebGL Programming Guide text. I'm stuck trying to retrieve an attribute location from a vertex shader program.
I created a class to encapsulate WebGL functions. I load the WebGL program with:
// load shaders into WebGL:
loadShaders(vertexName, fragmentName) {
const vertexShader = this.loadShaderCode(vertexName, this.gl.VERTEX_SHADER);
const fragmentShader = this.loadShaderCode(fragmentName, this.gl.FRAGMENT_SHADER);
const shaderProgram = this.gl.createProgram();
this.gl.attachShader(shaderProgram, vertexShader);
this.gl.attachShader(shaderProgram, fragmentShader);
this.gl.linkProgram(shaderProgram);
if (!this.gl.getProgramParameter(shaderProgram, this.gl.LINK_STATUS)) {
console.log(`Error initializeing shader program:\n ${this.gl.getProgramInfoLog(shaderProgram)}`);
return null; }
console.log('Attached and linked shaders');
return shaderProgram;
} // loadShaders
The individual shaders are loaded with:
loadShaderCode(shaderName, shaderType) {
const fileName = `sources/${shaderName}.glsl`;
const sourceCode = loadFile(fileName);
if (!sourceCode) {
console.log(`Error loading shader source code:\n File: ${fileName}`)
return null;
}
const shader = this.gl.createShader(shaderType);
this.gl.shaderSource(shader, sourceCode);
this.gl.compileShader(shader);
if (!this.gl.getShaderParameter(shader, this.gl.COMPILE_STATUS)) {
console.log(`Error loading ${shaderName}:\n File: ${fileName}\n ${this.gl.getShaderInfoLog(shader)}`);
this.gl.deleteShader(shader);
return null; }
console.log(`Loaded shader ${shaderName} from ${fileName}`);
return shader;
The vertex shader is:
attribute vec4 a_position;
void main() {
gl_Position = a_position;
gl_PointSize = 10.0;
}
Neither loadShaderCode or loadShaders return any errors when executed. The resulting glm.program variable shows as a WebGLProgram type in the browser debug console. When I execute:
a_Position = glm.program.getAttribLocation(glm.program, 'a_position');
I receive: TypeError: glm.program.getAttribLocation is not a function.
I'm new to the WebGL world and am stuck on this. Any advice would be much appreciated!
getAttribLocation
is a member function of the WebGLContext
not the WebGLShaderProgram
. None of the returned objects of the WebGL API have any member functions, they're solely used for typing.