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 속성을 설정하려고하면 "cannot set property of 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 Texture 이 없으며 .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로 전달 되어야합니다.