Web浏览器中运行Webgl程序时不显示形状

时间:2015-09-16 02:49:54

标签: graphics opengl-es glsl webgl

我正在学习如何使用着色器,而我正在尝试为卡通风格的形状编写顶点和片段着色器。我有一个彩色球体的示例代码,它可以正常工作,所以我将该文件中的结构复制到我正在创建的那个中。但是,当我运行我的文件时,页面上只显示黑色背景而不显示形状。我尝试比较这两个文件,以确保我有所有的锅炉板代码,它似乎是这样,但因为我是计算机图形编程的新手,可能有一些重要的,我要离开。我的程序做错了什么或者应该添加什么?该计划的代码如下:

<script src=lib1.js></script>
<body bgcolor=black>
<center>
<canvas id='canvas1' width='600' height='600'>
</canvas>
</center>
</body>


<script id='vs' type='other'>
   uniform vec3 lightDir;
   varying float intensity;
   void main(){
       vec3 ld;
       intensity = dot(lightDir, gl_Normal);
       gl_Position = ftransform();
   }
</script>


<script id='fs' type='other'>
varying float intensity;
void main(){
    vec4 color;
    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;
    }
</script>


<script>
start_gl("canvas1", getStringFromScript('vs'), getStringFromScript('fs'));
</script>

1 个答案:

答案 0 :(得分:1)

正如@Reto在评论中所提到的那样,WebGL中没有, succes: function(data, status, jqXHR){ if (status == 200) { $('#modal-form').hide(); $('#ajaxResults').addClass('alert alert-success').html(response.message); alert(data); } } gl_Normal这样的东西。这些来自旧的桌面OpenGL。它们不是OpenGL ES 2.0的一部分,这是WebGL的基础

Maybe you should start lower level