爆炸镶嵌着色器textureCube绘图不是真正的纹理

时间:2016-02-01 00:26:59

标签: javascript three.js shader fragment-shader

我想像这样(http://threejs.org/examples/#webgl_modifier_tessellation)制作爆炸效果,但是对于具有全景纹理的立方体(具有6个图像的立方体)。

我将顶点着色器转换为:

uniform float amplitude;

            attribute float displacement;

            varying vec3 vNormal;
            varying vec2 vUv;

            void main() {

                vNormal = normal;
                vUv = ( 0.5 + amplitude ) * uv + vec2( amplitude );

                vec3 newPosition = position + amplitude * normal * vec3( displacement );
                gl_Position = projectionMatrix * modelViewMatrix * vec4( newPosition, 1.0 );

            }

并通过添加samplerCube和textureCube对此进行分段:

varying vec3 vNormal;
            varying vec2 vUv;

            uniform samplerCube texture1;

            void main() {
                vec3 light = vec3( 0.5, 0.2, 1.0 );
                light = normalize( light );

                float dProd = dot( vNormal, light ) * 0.5 + 0.5;

                gl_FragColor = vec4( vec3( dProd ), 1.0 );
                gl_FragColor = textureCube(texture1, vNormal);

            }

但结果看起来并不好,它显示的是颜色,但不是真正的细节纹理(看起来质感http://pg2.paraplan.io/_pano/cube/1024/nx.jpg)。

你能帮我设置着色器,或者可能知道如何在没有着色器的情况下爆炸镶嵌细分吗?

DEMO:http://pg2.paraplan.io/_pano/cube/scene.html

0 个答案:

没有答案