Enabling an extension on a Three.js shader

问题

How can I enable an extension on a Three.js shader?

My code so far:

getting extension:

var domElement = document.createElement( 'canvas' );
var gl = domElement.getContext('webgl') || domElement.getContext('experimental-webgl');
gl.getExtension('OES_standard_derivatives');

on my shader:

fragmentShader: [
    "#extension GL_OES_standard_derivatives : enable",
    "code..."
]...

The console output:
WARNING: 0:26: extension 'GL_OES_standard_derivatives' is not supported
ERROR: 0:32: 'dFdx' : no matching overloaded function found
ERROR: 0:32: '=' : cannot convert from 'const mediump float' to '2-component vector of float'
ERROR: 0:33: 'dFdy' : no matching overloaded function found
ERROR: 0:33: '=' : cannot convert from 'const mediump float' to '2-component vector of float'

After reading this issue on github, I tried this example: From http://jsfiddle.net/VJca4/ I get these errors

WARNING: 0:27: extension 'GL_OES_standard_derivatives' is not supported
ERROR: 0:30: '=' : cannot convert from 'const mediump float' to '2-component vector of float'
ERROR: 0:31: 'dFdx' : no matching overloaded function found
ERROR: 0:31: '=' : cannot convert from 'const mediump float' to '2-component vector of float'

回答1:

You should also be able to do this:

renderer.context.getExtension('OES_standard_derivatives');

回答2:

Found the error. You have to use the renderer's dom element:

var gl = renderer.domElement.getContext('webgl') ||
            renderer.domElement.getContext('experimental-webgl');
gl.getExtension('OES_standard_derivatives');

来源：https://stackoverflow.com/questions/11071693/enabling-an-extension-on-a-three-js-shader

标签

glsl

shader

WebGL

three.js