問題タブ [uv-mapping]

シーンを texture にレンダリングする Three.js のこのデモをいじった後、私は自分のプロジェクトでその本質をうまく複製しました: 私のメイン シーンの中に球体があり、THREE.WebGLRenderTargetバッファを介してセカンダリ シーンがその上に描画されます。

とはいえ、実際には球体は必要ありません。ここで、巨大なレンガの壁にぶつかりました。バッファーを単純なカスタム メッシュにマップしようとすると、次のエラーの無限ストリームが発生します。

環状形状を近似する私のジオメトリは、このコードを使用して作成されます。マテリアル オプションcanvasを渡してUV マッピングに成功しましたが、使用すると上記のエラーが発生します。{map: new THREE.Texture(canvas)}{map: myWebGLRenderTarget}

コール スタックをざっと見てみると、three.js がtexture.imageon 属性の存在を想定してそれmyWebGLRenderTargetを呼び出そうとしているように見えますclampToMaxSize。

これは three.js のバグですか、それとも単に間違っているのでしょうか? フラット レンダリング ( を使用MeshBasicMaterial) のみが必要なので、上記のレンダリングからテクスチャへのデモを適応させたときに最初にしたことの 1 つは、シェーダーのすべてのトレースを削除することでした。球体だけでうまく機能しました。UV マッピングとカスタム メッシュを使用するには、これらのシェーダーを元に戻す必要がありますか?

ExtrudeGeometry オブジェクトにテクスチャを適用する必要があります。

形状は円で、押し出しパスは 2 つのベクトルで構成されます。

• トップ用の 1 つ。
• 底に1つ。

ジオメトリの上部/下部セクションを正確な位置に配置する必要があり、作成されるジオメトリが常に純粋に垂直であるとは限らないため (たとえば、斜めの円柱など)、cylinderGeometry を選択しませんでした。

これは断面図です (1 つの上部ベクトル、1 つの下部ベクトル、およびこれら 2 つのベクトル間で押し出された形状)。

適用しようとしているテクスチャの写真。

私がしたいのは、この画像をオブジェクトの垂直方向に一度だけラップすることだけです。

これが私のコードです:

ご覧のとおり、マッピングはまったく正しくありません。

過去 3 日間、この問題に関する多くの情報を読みました。しかし、私はTHREE.JSが初めてなので、オプションが不足しています。

UV座標を再定義する必要があると思いますが、これを行う方法がわかりません。

THREE.JS では、円柱状のオブジェクトにテクスチャをラップするのは簡単ではないようです。

誰かがこの問題について私を助けてくれますか?

UV gBuffer を使用してテクスチャ再投影をコーディングしようとしています (これは、そのピクセルでのマッピングに必要な UV 値を含むテクスチャです)

これはこの写真を見るだけでもわかりやすいと思います（評判が悪いので添付できません） 。

最初の画像 (黒/黄/赤/緑) は UV gBuffer で、UV 値を表し、2 番目の画像は拡散チャネル、3 番目の画像は目的の結果です。

これを OpenGL で作成するのは非常に簡単です。

単純な長方形を描画し、断片化されたシェーダーとして次の疑似コードを使用します。

float2 newUV=texture(UVgbufferTex,gl_TexCoord[0]).xy; float3 finalcolor=texture(DIFFgbufferTex,newUV);

float4(最終色,0)を返します;

OpenGL はミップマップ レベル、異方性フィルタリングなどの選択を処理しますが、通常の CPU プロセスでこれを行うと、最終色のピクセルが 1 つ得られるため、結果が鮮明になります。

ここで何かアドバイスはありますか？一種のミップマップを手動で計算し、隣接するピクセルをチェックしてレベルを選択することについて疑問に思っていましたが、これが正しい方法であるかどうかはわかりません。逆に。

実際、私はこの種のコードを長い間使用していましたが、内部について考えたことはなかったので、これが OpenGL/DirectX で内部的にどのように計算されるかはわかりません。

球の表面の一部を表すメッシュがあり、頂点の UV 座標を特定するのに苦労しています。

頂点の生成コードを考えると、UV座標を決定する方法の例を誰かが説明/提供できますか?

渡された「地域」には、北、南、東、西の度数が含まれます。このコードは、値をラジアンに変換し、水平方向と垂直方向の両方で目的の数の頂点をステップする量を決定します。

そのくらいうまくいきます。

この「領域」では、球の表面の一部が生成され、テクスチャの角がメッシュの角でもあるその部分にテクスチャを配置したいと考えています。

言い換えれば、以下のコードで「todo」を行うにはどうすればよいですか...

OpenGL 4.3 と GLSL を使用してアプリケーションを作成しています。シェーダーで基本的な UV マッピングを行う必要があります。問題は、GLSL コンパイラが UV 座標を最適化しているように見えることです。アプリケーション側からはアクセスできません。

頂点シェーダー:

頂点シェーダー:

頂点シェーダーとフラグメント シェーダーの両方がエラーなしでコンパイルおよびリンクされますが、次のコードを使用して属性を呼び出すと:

の場合は 0 を取得し、 の場合はposition-1を取得するため、頂点シェーダーからフラグメント シェーダーに渡すために使用しているにもかかわらず、 が最適化されているuvCoordとしか想定できません。uvCoord

その結果、ジオメトリは表示されますが、黒のみでテクスチャ マッピングは表示されません。

Direct3D と HLSL で同様のアプリケーションを作成しましたが、属性が最適化されるという問題はありません。忘れていること、またはしていないことは簡単なことだと思いますが、何がわからないのですか。

私が見つけることができるすべての例は、メッシュで UV マッピングを使用しています。スプライトを UV マッピングする例はありますか? テクスチャ イメージの 4 分の 1 をスプライトにマッピングしようとしています。

ブレンダー 2.74 で立方体を UV マップしようとしていますが、左側の画像には 6 つの面すべてが配置されていますが、右側の立方体に実際に表示されるのはそのうちの 2 つだけです。さまざまな方法でアンラップを試み、左側の四角形を動かしてみましたが、まだ 2 つの側面しか画像が表示されません。

より複雑な形状 (木) を試してみると、どのようにアンラップしても、どの面にもテクスチャが表示されません。

ただし、.obj ファイルとしてエクスポートし、opengl で描画すると、すべての面がテクスチャ化され、UV マップした場所にテクスチャ座標が配置されます。だから私の問題は、実際にファイルをエクスポートするまで、それがどのように見えるか分からないということです.

マッピングを行うときに、オブジェクトのすべての面をテクスチャ付きで表示するにはどうすればよいですか?