科技行者

行者学院 转型私董会 科技行者专题报道 网红大战科技行者

知识库

知识库 安全导航

至顶网软件频道基础软件Toon Shading Using GLSL

Toon Shading Using GLSL

  • 扫一扫
    分享文章到微信

  • 扫一扫
    关注官方公众号
    至顶头条

卡通渲染是一种非真实感渲染(non-photorealistic render)。而卡通着色是一种简单非真实着色。它运用很少的颜色通常是颜色调和,所以经常是从一种色调变化到另一种色调。但是给人一种三维模型的感觉。

作者:Skyman 来源:CSDN 2008年3月25日

关键字: Toon Shading GLSL 游戏 Linux

  • 评论
  • 分享微博
  • 分享邮件
卡通渲染是一种非真实感渲染(non-photorealistic render)。而卡通着色是一种简单非真实着色。它运用很少的颜色通常是颜色调和,所以经常是从一种色调变化到另一种色调。但是给人一种三维模型的感觉。

 

    上面茶壶出现的色调是基于角度的挑选的。实际上是光照方向与法线方向的cosine

所以,当法线离光照方向很近的情况下,将会出现亮的色调。当光照方向与法线方向的夹角很大时,渲染的地方就会很暗。换句话而言就是,夹角的cosine值影响色调的强度。

      Cosine值的计算可以利用下面这个公式,也既是点积公式。

     cos(lightDir,normal) = lightDir . normal / ( |lightDir| * |normal| )

   当法线向量和光照都被归一化,这个公式将被简化成:

     cos(lightDir,normal) = lightDir . normal

   因此,我们定义一个名字为intensity的变量用来存储cosine的值。在glsl中,这个值通过点积计算出来。

        intensity = dot(lightDir, gl_Normal);

 

    在写着色器代码之前,我们可以在应用程序中定义光照信息来代替在着色器中定义的varying变量lightDir。不过,我们不用象传统渲染管线那样利用glEnable开启光源。GLSL可以得到OpenGL状态,也就是可以得到光照属性。该光照属性是以数据结构存储的,结构命为gl_LightSourceParameters,大概如下:

struct gl_LightSourceParameters {

        vec4 ambient;

        vec4 diffuse;

        vec4 specular;

        vec4 position;

        ...

};

 

uniform gl_LightSourceParameters gl_LightSource[gl_MaxLights];

 

    这样就可以在点着色器中得到光照方向。但是必须确定方向向量归一化。OpenGL规范强调:一旦光源位置被设置,该位置将自动转换成观察坐标系,我们可以假设光源位置自动转换成观察坐标系后仍然保持其方向向量的归一化。

    在进行点积计算的时候,必须将法线转换成观察坐标系。因为2个向量在同一个坐标系中进行点积运算才有意义。为了把法线转换在观察坐标系中,我们可以利用事先定义好的uniform变量gl_NormalMatrix这个矩阵是视图矩阵的上3×3子矩阵逆转置矩阵。在点着色器中,进行法线的转换。点着色器的代码设计就可以如下:

        varying vec3 normal;

              

               void main()

               {

 

                               normal = gl_NormalMatrix * gl_Normal;

              

                               gl_Position = ftransform();

               }

    在片断着色器中首先需要注意将法线向量归一化,然后利用通过光照位置和法线进行点积运算后得到光照强度。片断着色器的代码设计如下:

        varying vec3 normal;

              

               void main()

               {

                               float intensity;

                               vec4 color;

                               vec3 n = normalize(normal);

                              

                               intensity = dot(vec3(gl_LightSource[0].position),n);

                              

                               if (intensity > 0.95)

                                              color = vec4(1.0,0.5,0.5,1.0);

                               else if (intensity > 0.5)

                                              color = vec4(0.6,0.3,0.3,1.0);

                               else if (intensity > 0.25)

                                              color = vec4(0.4,0.2,0.2,1.0);

                               else

                                              color = vec4(0.2,0.1,0.1,1.0);

                              

                               gl_FragColor = color;

               }

    运行后的贴图为:

                

    • 评论
    • 分享微博
    • 分享邮件
          邮件订阅

          如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。

          重磅专题
          往期文章
          最新文章