予期伸ばしテクスチャ

Question

私は、次のコードスニペットを持っている：

ctx.texParameteri(ctx.TEXTURE_2D, ctx.TEXTURE_MAG_FILTER, ctx.LINEAR);  
    ctx.texParameteri(ctx.TEXTURE_2D, ctx.TEXTURE_MIN_FILTER, ctx.LINEAR); 

    ctx.texParameteri(ctx.TEXTURE_2D, ctx.TEXTURE_WRAP_S, ctx.REPEAT); 
    ctx.texParameteri(ctx.TEXTURE_2D, ctx.TEXTURE_WRAP_T, ctx.REPEAT); 

マイテクスチャ寸法は256×256 です。

オプション1 - 私のポリゴン

const x0 = 100; 
const x1 = -x0; 
const z0 = x0; 
const z1 = -z0; 
var vertices = new Float32Array(
    [ x0, 0, z1, x1, 0, z1, x1, 0, z0, x0, 0, z0]); 

結果：テクスチャが伸びているので、私は細部を失います。

オプション2 - 私のポリゴン

const x0 = 5; 
const x1 = -x0; 
const z0 = x0; 
const z1 = -z0; 
var vertices = new Float32Array(
    [ x0, 0, z1, x1, 0, z1, x1, 0, z0, x0, 0, z0]); 

結果を（これはオプション1よりもはるかに小さい多角形であることに注意してください）：私は私のテクスチャの詳細を見ることができます。

私は、REPEAT（TEXTURE_WRAP_SとTEXTURE_WRAP_T）オプションはオプション1でも詳細を教えてくれることを理解しています。オプション1でテクスチャが伸びているのはなぜですか？私はそれを誤解しましたか？

これはChrome CanaryでWebGLを実行しています。

どうしたのですか？

ご協力いただきありがとうございます。

Answer 1

私は私のテクスチャは以下に座標変更：

コード： するvar texCoords =新しいFloat32Array（ // [1、1、0、1、0、0、1、0]
[100 、100、-100,100、-100、-100,100、-100]
）;

大きなポリゴンの座標に一致します。大きなポリゴンの元の小さなテクスチャの詳細を示します。

より詳細な議論のためのKhronos WebGL Forum