Three.js: 画像テクスチャのスケーリングとオフセット

そこに着きましたが、オフセットパラメータと繰り返しパラメータの使用方法に関するドキュメントを見つける必要があります。 それらは0から1の間である必要があるようで、ピクセルに変換する値を取得する方法がわかりません。

tex = THREE.ImageUtils.loadTexture('texture.png');

tex.offset.x = ?
tex.offset.y = ?
tex.repeat.x = ?
tex.repeat.y = ?

他の人に役立つ場合に備えて、私のソリューションを投稿します。 結局、テクスチャにキャンバスを使用し、代わりにそこに画像をロード/トリミングしました。 これまでのところ正常に動作しているようです。

canvas = document.createElement('canvas');
canvas.height=200;
canvas.width=200;

ctx = canvas.getContext('2d');
ctx.fillStyle = '#FFFFFF';  
ctx.fillRect(0, 0, 200, val.200);

//this is where we set the "offset"
offx = -1 * 200;
offy = -1 * 200;

//img is a standard loaded image object
ctx.drawImage(img,offx,offy);

tex = new THREE.Texture(canvas);

それはそれを行う方法ですが、GPUを使用したい場合はこれを行うことができます：

tex.scale.x = 800 / 100;
tex.scale.y = 2000 / 100;
tex.offset.x = ( 300 / 100 ) * tex.scale.x;
tex.offset.y = ( 400 / 100 ) * tex.scale.y;

または線に沿った何か:)

涼しい！ フォローアップしてくれてありがとう

GPUでこれを行うと、確かによりパフォーマンスが向上します。 ただし、テクスチャのscale.xプロパティを設定しようとすると、「xのプロパティを設定できません」というエラーが発生し続けます。 何か案は？ tex.scale.set（w、h）メソッドを使用して試してみたところ、同じ結果になりました。

tex = THREE.ImageUtils.loadTexture(img.src);

scalex = img.width / 100;
scaley = img.height / 100;

tex.scale.x = scalex;
tex.scale.y = scaley;

tex = THREE.ImageUtils.loadTexture(img.src);

これは奇妙なことです。画像にすでにsrcが含まれている場合、それはすでに読み込まれていることを意味します。 なぜ再度ロードするのですか？

代わりにこれを実行したいと思います。

tex = new THREE.Texture( img );

おかげで、はい、imgオブジェクトで直接THREE.Texture（）を使用するだけで、処理が高速化されたようです。 ただし、tex.scale操作でエラーが発生します。 とにかくtex.repeatを使用してスケーリングを変換しますか？ これらの値を問題なく微調整できます。

ああ、本当。 Textureは.scaleがなく、 .repeatます。 これを試して：

tex.repeat.x = 100 / 800;
tex.repeat.y = 100 / 2000;
tex.offset.x = ( 300 / 100 ) * tex.repeat.x;
tex.offset.y = ( 400 / 100 ) * tex.repeat.y;

リピートとオフセットのプロパティについて学ぶためだけにテクスチャをスケーリングする方法を理解するためにここに来ました。しかし、どうすればそれらをスケーリングできますか？

@nightlifeloverガイドラインに記載されてstackoverflowに送信する必要があります。