WebGLShader
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Le WebGLShader fait partie de l'API WebGL et peut être un shader de sommet ou de fragment. Un WebGLProgram
requiert les deux types de shaders.
Description
Pour créer un WebGLShader, utiliser WebGLRenderingContext.createShader
, puis reliez-y le code source GLSL en utilisant WebGLRenderingContext.shaderSource()
, et enfin, appelez WebGLRenderingContext.compileShader()
pour terminer et compiler le shader. À ce stade, le WebGLShader n'est toujours pas sous une forme utilisable et doit toujours être relié à un WebGLProgram
.
function creerShader(gl, codeSource, type) {
// Compile un shader de type soit gl.VERTEX_SHADER, soit gl.FRAGMENT_SHADER
var shader = gl.createShader(type);
gl.shaderSource(shader, codeSource);
gl.compileShader(shader);
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
var info = gl.getShaderInfoLog(shader);
throw "Impossible de compiler le programme WebGL.\n\n" + info;
}
return shader;
}
Voir WebGLProgram
pour des informations sur la liaison de shaders.
Exemples
Création d'un shader de sommet
Notez qu'il existe de nombreuses autres stratégies pour écrire des chaînes de code source de shader et y accéder. Ces exemples sont à titre d'illustration seulement.
var sourceShaderDeSommet =
"attribute vec4 position;\n" +
"void main() {\n" +
" gl_Position = position;\n" +
"}\n";
// Utilisez la function creerShader de l'exemple ci-dessus
var shaderDeSommet = creerShader(gl, sourceShaderDeSommet, gl.VERTEX_SHADER);
Création d'un shader de fragment
var sourceShaderDeFragment =
"void main() {\n" + " gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);\n" + "}\n";
// Utilisez la fonction creerShader de l'exemple ci-dessus
var shaderDeFragment = creerShader(
gl,
sourceShaderDeFragment,
gl.FRAGMENT_SHADER,
);
Spécifications
Specification |
---|
WebGL Specification # 5.8 |
Compatibilité des navigateurs
BCD tables only load in the browser
Voir aussi
WebGLProgram
WebGLRenderingContext.attachShader()
WebGLRenderingContext.bindAttribLocation()
WebGLRenderingContext.compileShader()
WebGLRenderingContext.createProgram()
WebGLRenderingContext.createShader()
WebGLRenderingContext.deleteProgram()
WebGLRenderingContext.deleteShader()
WebGLRenderingContext.detachShader()
WebGLRenderingContext.getAttachedShaders()
WebGLRenderingContext.getProgramParameter()
WebGLRenderingContext.getProgramInfoLog()
WebGLRenderingContext.getShaderParameter()
WebGLRenderingContext.getShaderPrecisionFormat()
WebGLRenderingContext.getShaderInfoLog()
WebGLRenderingContext.getShaderSource()
WebGLRenderingContext.isProgram()
WebGLRenderingContext.isShader()
WebGLRenderingContext.linkProgram()
WebGLRenderingContext.shaderSource()
WebGLRenderingContext.useProgram()
WebGLRenderingContext.validateProgram()