Как повторить текстуру, такую как GL_REPEAT?

У меня есть модель дома в моей игре, и у меня есть материалы для геометрии дома. Существует материал для стены дома, и у меня есть текстура-карта-изображение, чтобы показать кирпичи.Как повторить текстуру, такую как GL_REPEAT?

var mat = new THREE.MeshPhongMaterial({ 
    ambient: 0x969696, 
    map: THREE.ImageUtils.loadTexture('textures/G/G0.jpg'), 
    overdraw: true,combine: THREE.MultiplyOperation 
});

Таким образом, выше, карта текстуры выглядит как GL_CLAMP я хочу, чтобы показать, как GL_REPEAT.

Что мне делать?

Если вы не видите изображения, отметьте this.

источник

2012-07-03 user1497753

Это называется THREE.RepeatWrapping. Значение loadTexture по умолчанию - THREE.ClampToEdgeWrapping (см. Функцию ctor из предыдущей ссылки). Не знаю, можете ли вы использовать callback (потому что в JS немного странно (похоже, что он указывает на созданный Image, а не на созданный Texture)). Подпись:

loadTexture: function (path, mapping, callback) {

Лучше просто назвать текстуру локально и установить режимы обруча вручную:

var t = THREE.ImageUtils.loadTexture('textures/G/G0.jpg'); 
t.wrapS = t.wrapT = THREE.RepeatWrapping;

Похоже, что вы не собираетесь далеко с threejs, не смотря на фактический код ...

источник

2012-07-03 06:48:47

Я пытаюсь установить wrapS и wrapT как это, но это не сработает. Я думаю, что материал неправильный, теперь я использую MeshPhongMaterial, следует ли вместо этого использовать ShaderMaterial? – user1497753

Не знаю, я попытался бы это сделать. Текстура должна быть сильной двух, см. [WebGLRenderer, l. 5721] (https://github.com/mrdoob/three.js/blob/master/src/renderers/WebGLRenderer.js). –

У меня была аналогичная проблема, я масштабировал куб, а текстура была растянута. Чтобы предотвратить это, вам нужно установить новый размер куба в 'render()' следующим образом: 'texture.repeat.set (2 * cWidth, 2 * cHeight);' (тогда текстура ведет себя как немасштабированный шаблон). Надеюсь, это поможет. –

Я разместил полный рабочий пример по адресу: http://stemkoski.github.com/Three.js/Texture-Repeat.html

соответствующая часть примера кода является:

// for example, texture repeated twice in each direction 
var lavaTexture = THREE.ImageUtils.loadTexture('images/lava.jpg'); 
lavaTexture.wrapS = lavaTexture.wrapT = THREE.RepeatWrapping; 
lavaTexture.repeat.set(2, 2); 
var lavaMaterial = new THREE.MeshBasicMaterial({ map: lavaTexture }); 
var lavaBall = new THREE.Mesh(THREE.GeometryUtils.clone(sphereGeom), lavaMaterial); 
scene.add(lavaBall);

источник

2012-07-04 12:16:35

Большое спасибо! Я знаю, как сделать повторение текстуры на кубе и сфере. Но у меня есть еще один вопрос, как сделать текстуру повторяться в материалах геометрии? У меня есть некоторая загруженная модель в моей игре, у геометрии модели есть некоторые материалы, каждый из них имеет разные текстуры, так что вы могли бы дать мне несколько предложений или примеров? Спасибо! – user1497753

У меня это есть. Это точно так же! Изображение, которое я использовал, имеет размер 120 * 120, я меняю его на 128 * 128, поэтому проблема решена! Возможно, размер изображения должен быть 128 * 128 или 256 * 256 или что-то, если вы хотите увидеть 'repeat' – user1497753

Да, для того, чтобы функции повторения работали, размеры изображения должны быть равны 2. –

Изображение должно быть 8х8, 16х16, 32х32, 128х128, 256х256, 512x512 и т.д. И все будет работать. =)

источник

2014-11-24 12:02:14 Ilya

Для упаковки требуется, чтобы изображения были сильными (POT), но они не обязательно должны быть квадратными. – WestLangley

@WestLangley вы имеете в виду, что 8x512 будет работать? – fuchs777

@ fuchs777 Это правильно. – WestLangley

Как повторить текстуру, такую ​​как GL_REPEAT?

ответ

Смежные вопросы

Как повторить текстуру, такую как GL_REPEAT?