0

ノイズを追加するための単純なシェーダーを作成しようとしています。しかし、以下の設定ではUV座標が取得できません。

フラグメント シェーダー:

uniform float seed;
uniform sampler2D pass;

varying vec2 vUv;

void main (){
    //noise
    vec2 pos = gl_FragCoord.xy;
    pos.x *= seed;
    pos.y *= seed;
    float lum=fract(sin(dot(pos ,vec2(12.9898,78.233))) * 434658.5453116487577816842168767168087910388737310);

    vec4 tx = texture2D(pass, vUv);

    gl_FragColor = vec4(tx.r*lum,tx.g*lum,tx.b*lum,1.0);

}

頂点シェーダー:

varying vec2 vUv;

void main (){
    vUv = uv;
    gl_Position = projectionMatrix * modelViewMatrix * vec4(position,1.0);
}

レンダリング：

OBJECT.material = OBJECT.mat.flat; // THREE MeshPhongMaterial ({color: 0xE40D59,shading:THREE.FlatShading});

RENDERER.render(SCENE,CAMERA,BEAUTY_PASS,false);

OBJECT.material = OBJECT.mat.noise; // THREE ShaderMaterial

RENDERER.render(SCENE,CAMERA);

次のエラーが表示されます。

エラー: WebGL: DrawElements: バインドされた頂点属性バッファーには、バインドされた要素配列 @ http://threejs.org/build/three.min.js:439からの特定のインデックスに対して十分なサイズがありません

いくつかのテストを行いましたが、すべてのピクセルに対して同じ座標を選択することで実行できます

vec4 tx = texture2D(pass, vec2(0.5,0.5));

これにより、オブジェクトが赤みを帯びたノイズの多い色で表示されますが、最初のレンダリング パス ( ) を削除すると、vUv 変数は完全に正常に機能しますRENDERER.render(SCENE,CAMERA,BEAUTY_PASS,False)。

2 番目のレンダリングで UV 座標を取得できないのはなぜですか? いくつかの例によると、この例のように同じシーンとカメラを使用してレンダリングできるはずです

4

1 に答える 1

1

初期テクスチャがなければ、ジオメトリには必要なベイクイン WebGL UV バッファがありません。

いくつかの解決策がありますが、おそらく最も簡単なのは、メッシュの最初のレンダリングにテクスチャがあることを確認することです。シンプルな白いもので十分です。

three.js r.58

于 2013-05-27T05:08:19.467 に答える