正接および正接ベクトルを計算する方法

Three.jsにテクスチャを読み込んでから、シェーダーに渡しました。頂点シェーダーで法線を計算し、UVベクトルを変数に保存します。

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

                varying vec3 N,P;
                varying vec2 UV;

                void main() {
                    gl_Position= projectionMatrix * modelViewMatrix * vec4(position,1.0);
                    P= position;
                    N= normalMatrix * vec3(normal);
                    UV= uv;
                }
            </script>
            <script id="fragmentShader" type="x-shader/x-fragment">

                varying vec3 N,P;
                varying vec2 UV;
                uniform sampler2D texture;

                void main() {
                    gl_FragColor= texture2D(texture,UV);
                }

            </script>

TおよびBベクトルをどのように計算しますか？

まず、すべての3D頂点には、無限接線および双接ベクトルがあります。以下の画像は、各頂点に無限の接線スペースがある理由を説明しています。接線と接線は、表示された平面で任意の方向を持つことができます。

したがって、最も有用な¹接線空間を適切に計算するために、x軸（接線）がバンプマップのu方向に対応し、y軸（双接）がv方向に対応するように、接線空間を整列させます。バンプマップでは、接線空間のZ方向にすでに対応している頂点の法線が既にあるはずです。

_{（1）最後に、テクスチャから法線ベクトルをサンプリングしたいので、最も便利です。}

それは写真で説明するのが最善です。接線空間を(u, v)下の図のように整列させます。

コンピュータグラフィックスに厳密には関連していませんが、画像のソース

コンピュータグラフィックスでは、開発者は通常(u,v)、テクスチャ座標とも呼ばれるものを使用します。Tは接線、Bは接線でありP0、ターゲット頂点であり、三角形の一部であると仮定します(P0,P1,P2)。

まず、私たちがやりたかったことを思い出してください。タンジェントとビタンゲットを計算することです。

1. Tはuに揃えられ、Bはvに揃えられます。
2. TとBは、頂点法線を持つ平面（上の図に示されている平面）に配置されます。

ポイントは、TとBが同じ平面上にあり、UとVに対応していることをすでに想定していることです。これらの値を知ることができれば、外積と3番目のベクトルで、ワールドから接線空間への変換行列を構築できます。

任意の2Dベクトルが2つの独立したベクトル^2の線形結合として記述できることを知っていると仮定すると、上の画像に示すように、三角形の点（エッジ）が既にあるためです。我々は書ける：

E1 =（u1-u0）T +（v1-v0）B

E2 =（u2-u0）T +（v2-v0）B

_{（2）実際、これが基底行列の導出方法です}

上記の方程式は行列形式で書くことができます。

| E1x E1y E1z |   | deltaU1 deltaV1 | * | Tx Ty Tz |
| E2x E2y E2z | = | deltaU2 deltaV2 |   | Bx By Bz |

行列方程式を解くことで、T値とB値を決定でき、変換行列を構築できます。

C ++の完全なソースコード

#include "Vector4D.h"


struct Triangle
{
    unsigned short  index[3];
};


void CalculateTangentArray(long vertexCount, const Point3D *vertex, const Vector3D *normal,
        const Point2D *texcoord, long triangleCount, const Triangle *triangle, Vector4D *tangent)
{
    Vector3D *tan1 = new Vector3D[vertexCount * 2];
    Vector3D *tan2 = tan1 + vertexCount;
    ZeroMemory(tan1, vertexCount * sizeof(Vector3D) * 2);

    for (long a = 0; a < triangleCount; a++)
    {
        long i1 = triangle->index[0];
        long i2 = triangle->index[1];
        long i3 = triangle->index[2];

        const Point3D& v1 = vertex[i1];
        const Point3D& v2 = vertex[i2];
        const Point3D& v3 = vertex[i3];

        const Point2D& w1 = texcoord[i1];
        const Point2D& w2 = texcoord[i2];
        const Point2D& w3 = texcoord[i3];

        float x1 = v2.x - v1.x;
        float x2 = v3.x - v1.x;
        float y1 = v2.y - v1.y;
        float y2 = v3.y - v1.y;
        float z1 = v2.z - v1.z;
        float z2 = v3.z - v1.z;

        float s1 = w2.x - w1.x;
        float s2 = w3.x - w1.x;
        float t1 = w2.y - w1.y;
        float t2 = w3.y - w1.y;

        float r = 1.0F / (s1 * t2 - s2 * t1);
        Vector3D sdir((t2 * x1 - t1 * x2) * r, (t2 * y1 - t1 * y2) * r,
                (t2 * z1 - t1 * z2) * r);
        Vector3D tdir((s1 * x2 - s2 * x1) * r, (s1 * y2 - s2 * y1) * r,
                (s1 * z2 - s2 * z1) * r);

        tan1[i1] += sdir;
        tan1[i2] += sdir;
        tan1[i3] += sdir;

        tan2[i1] += tdir;
        tan2[i2] += tdir;
        tan2[i3] += tdir;

        triangle++;
    }

    for (long a = 0; a < vertexCount; a++)
    {
        const Vector3D& n = normal[a];
        const Vector3D& t = tan1[a];

        // Gram-Schmidt orthogonalize
        tangent[a] = (t - n * Dot(n, t)).Normalize();

        // Calculate handedness
        tangent[a].w = (Dot(Cross(n, t), tan2[a]) < 0.0F) ? -1.0F : 1.0F;
    }

    delete[] tan1;
}

完全なソースコードと派生物はここにあります。