如何在WebGL中执行颜色材质跟踪
我知道在OpenGL中使用以下代码执行此操作:如何在WebGL中执行颜色材质跟踪,webgl,Webgl,我知道在OpenGL中使用以下代码执行此操作: glDisable(GL_LIGHTING); glEnable(GL_COLOR_MATERIAL); 如何在WebGL中模拟它?这里有一个blinn phong着色器,它模拟OpenGL固定功能管道进行逐顶点照明。默认情况下,这相当于启用了glEnable(GL_颜色_材质)和glColorMaterial(GL_正面_和背面,GL_环境_和漫反射)。通过将制服设置为1.0,可以模拟glColorMaterial,这将导致材质参数跟踪当前颜色
glDisable(GL_LIGHTING);
glEnable(GL_COLOR_MATERIAL);
如何在WebGL中模拟它?这里有一个blinn phong着色器,它模拟OpenGL固定功能管道进行逐顶点照明。默认情况下,这相当于启用了glEnable(GL_颜色_材质)和glColorMaterial(GL_正面_和背面,GL_环境_和漫反射)。通过将制服设置为1.0,可以模拟glColorMaterial,这将导致材质参数跟踪当前颜色,而不是glMaterial设置的颜色
#version 120
////////////////////////////////////////////////////////////////////////////////
// http://www.glprogramming.com/red/chapter05.html //
// //
// color = (matEmission + globalAmbient * matAmbient) + //
// AttenuationFactor( 1.0 / ( Kc + Kl*d + Kq*d^2 ) ) * //
// [ (lightAmbient * matAmbient) + //
// (max(N.L,0) * lightDiffuse * matDiffuse) + //
// (max(N.H,0)^matShininess * lightSpecular * matSpecular) ] //
////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
// Uniforms //
////////////////////////////////////////////////////////////////////////////////
uniform float uColorMaterialAmbient = 1.0;
uniform float uColorMaterialDiffuse = 1.0;
uniform float uColorMaterialEmission = 0.0;
uniform float uColorMaterialSpecular = 0.0;
////////////////////////////////////////////////////////////////////////////////
// Main //
////////////////////////////////////////////////////////////////////////////////
void main(void)
{
vec4 matAmbient = mix(gl_FrontMaterial.ambient, gl_Color, uColorMaterialAmbient);
vec4 matDiffuse = mix(gl_FrontMaterial.diffuse, gl_Color, uColorMaterialDiffuse);
vec4 matEmission = mix(gl_FrontMaterial.emission, gl_Color, uColorMaterialEmission);
vec4 matSpecular = mix(gl_FrontMaterial.specular, gl_Color, uColorMaterialSpecular);
// Transform normal into eye space. gl_NormalMatrix is the transpose of the
// inverse of the upper leftmost 3x3 of gl_ModelViewMatrix.
vec3 eyeNormal = normalize(gl_NormalMatrix * gl_Normal);
// Calculate emission and global ambient light
vec4 emissionAmbient = matEmission + (gl_LightModel.ambient * matAmbient);
// Calculate ambient
vec4 lightAmbient = gl_LightSource[0].ambient * matAmbient;
// Transform the vertex into eye space
vec4 eyeVertex = gl_ModelViewMatrix * gl_Vertex;
vec3 eyeLightDir = gl_LightSource[0].position.xyz - eyeVertex.xyz;
float dist = length(eyeLightDir);
eyeLightDir = normalize(eyeLightDir);
// No attenuation for a directional light
float attenuationFactor = 1.0 / (gl_LightSource[0].constantAttenuation
+ gl_LightSource[0].linearAttenuation * dist
+ gl_LightSource[0].quadraticAttenuation * dist * dist);
// Calculate lambert term
float NdotL = max(dot(eyeNormal, eyeLightDir), 0.0);
// Calculate diffuse
vec4 lightDiffuse = NdotL * (gl_LightSource[0].diffuse * matDiffuse);
// Calculate specular
vec4 lightSpecular = vec4(0.0);
if ( NdotL > 0.0 )
{
float NdotHV = max(dot(eyeNormal, gl_LightSource[0].halfVector.xyz), 0.0);
lightSpecular = pow(NdotHV, gl_FrontMaterial.shininess) * (gl_LightSource[0].specular * matSpecular);
}
gl_FrontColor = emissionAmbient + attenuationFactor * (lightAmbient + lightDiffuse + lightSpecular);
gl_Position = ftransform();
}
你根本不能直接这么做。这使用了webgl中根本不存在的固定管道。您需要编写一个着色器。(仅仅使用像这样的固定颜色应该相当简单,但我还没有足够的经验来帮助glsl)