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);

Это способ сделать это, но если вы хотите использовать графический процессор, вы можете сделать это:

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;

Или что-то вроде :)

Круто! Спасибо за продолжение

Выполнение этого на графическом процессоре, безусловно, более производительно. Однако, когда я пытаюсь установить свойство 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 );

Спасибо, да, просто использование THREE.Texture () непосредственно на объекте img, похоже, ускорило процесс. Однако по-прежнему появляется ошибка при выполнении операций 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 .