0

現在、セル シェーディング スクリプトを使用して、使用しているモデルのランバート マテリアルをシェーディングしています。同じスクリプトを使用したいカスタム シェーダー マテリアルもありますが、言うは易く行うは難しです。カスタム マテリアルをランバート マテリアルに変更する方法があるかどうか疑問に思っていました。いくつか調べてみましたが、何も見つからないようです。どんな助けでも大歓迎です。これはこれまでのコードです。three_lamberton スクリプトは私が使用しているもので、画像を適用するオブジェクトに適用されます。上部のスクリプトは、画像をレイヤー化し、カスタム シェーダー マテリアルを設定するために使用しているものです。一部の画像が素材に複数回読み込まれるという事実は無視してください。現在、プレースホルダーとしてのみ行っています。

<!DOCTYPE html>
<html>
<head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Web GL test 2</title>
</head>

<body style="overflow: hidden; background: black;">
    <div id="container">


</div>
    <script src="three.min.js"></script>
    <script src="OBJLoader.js"></script>
    <script src="three_lambertoon_c.js"></script>


    <script id="fragment_shh" type="x-shader/x-fragment">
        #ifdef GL_ES
        precision highp float;
        #endif

        uniform sampler2D tOne;
        uniform sampler2D tSec;
        uniform sampler2D tThree;
        uniform sampler2D tFour;
        uniform sampler2D tFive;
        uniform sampler2D tSix;

    varying vec2 vUv;

    void main(void)
    {
        vec3 c;
        vec4 Ca = texture2D(tOne, vUv);
        vec4 Cb = texture2D(tSec, vUv);
        vec4 Cc = texture2D(tThree, vUv);
        vec4 Cd = texture2D(tFour, vUv);
        vec4 Ce = texture2D(tFive, vUv);
        vec4 Cf = texture2D(tSix, vUv);
        c = Ca.rgb * Ca.a + Cb.rgb * Cb.a + Cc.rgb * Cc.a + Cd.rgb * Cd.a 
            + Ce.rgb * Ce.a + Cf.rgb * Cf.a * (1.0 - Ca.a - Cb.a - Cc.a - Cd.a - Ce.a);
    gl_FragColor= vec4(c, 1.0);

    }

</script>

<script id="vertex_shh" type="x-shader/x-vertex">

    varying vec2 vUv;

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

</script>
4

1 に答える 1

1

わかりました。あなたが何を求めているかわかりました。少し混乱しているかもしれません。

マテリアルは、一度に 1 つの頂点シェーダーと 1 つのフラグメント シェーダーしか持つことができません。Three.js はLambert、ランバート シェーディングで物をレンダリングするような、いくつかのデフォルト シェーダーを提供します。このlabertoon.jsスクリプトは、Three.js が提供する Lambert シェーダーをハッキングして永久に変更しているように見えます。これは、Lambert マテリアルが代わりにこのハッキングされたバージョンを使用することを意味します。これは醜い方法です。

スクリプトが自分で何をするか見てみましょう。長くはありません: http://www.neocomputer.org/projects/donut/three_lambertoon_c.js

実際、シェーダーを組み合わせるのは難しいです。シェーダーには 1 つのエントリ ポイントがmain()あり、次に非常に特殊な一連の操作があります。これらの演算の順序は、数学の問題における演算の順序と同様に、非常に重要です。したがって、解決策は、両方のことを行う新しいシェーダーを作成することです。

その JS ファイルからシェーダー コードの行を取得し、独自のカスタム シェーダーに追加します。lambertoon次に、 js ファイルの使用を完全に停止します。

ただし、この場合、トゥーン シェーダーから独自のフラグメント シェーダーの下部にこれらの行を直接貼り付けることができ、それが機能する可能性があります。

于 2013-08-01T00:22:41.173 に答える