Three.JS: Как сделать так, чтобы текстуры перекрывали друг друга?

TL;DR: Как мне сделать так, чтобы текстуры казались больше, чем лица, к которым они прикреплены, с эффектом затухания, чтобы все текстуры перекрывали друг друга?

-

Изучение three.js путем воссоздания игры Warzone 2100. :)

Я загружаю текстуру по умолчанию для земли с помощью:

var texture = THREE.ImageUtils.loadTexture('tile-53.png'); // Specify file
texture.wrapS = texture.wrapT = THREE.RepeatWrapping; // Make the texture repeat
texture.repeat.set(map_width, map_height); // Repeat for every face
texture.anisotropy = 100; // Disable anisoptropy

На данный момент это выглядит так: это. Теперь сравните его с этим.

Warzone 2100, наконец, начала хорошо выглядеть с новым рендерером, особенно потому, что они сделали текстуры больше, чем лица, и перекрыли друг друга, заставив исчезнуть острые границы. Можно ли добиться такого же эффекта с помощью three.js, и если да, то как мне туда пойти?


javascript three.js 3d textures overlapping
person user2337969    schedule 21.08.2013    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Текстура - это то, что привязано к своей геометрии в первую очередь (говоря о 3D), поэтому сделать так, чтобы только сама текстура перекрывала другие текстуры, не совсем возможно. Однако вы можете сделать так, чтобы ваши геометрии идеально перекрывали друг друга.

Чтобы ваши текстуры выглядели «крупнее», попробуйте посмотреть здесь.

person Alex Under    schedule 21.08.2013
comment
Спасибо за ссылку. К сожалению, я уже нашел это, это не помогло. Я не понимаю, что он делает, но он, по крайней мере, не может помочь с тем, что я хочу. Однако я понимаю, что вы имеете в виду под перекрывающимися геометриями в том смысле, что я использую не одну плоскостную геометрию, а тысячи маленьких. Но разве это не разрушит карту, поскольку везде будут края, что сделает обнаружение столкновений невозможным? Поскольку геометрия должна быть больше, чем она должна быть для карты... Может быть, мне следует спросить разработчиков Warzone 2100, как они это сделали, и попытаться воссоздать это в ThreeJS. - person user2337969; 22.08.2013
comment
Когда я занимался разработкой игр, мы делали это следующим образом: мы генерировали сетку ландшафта для нашей игровой сцены из растрового изображения, а затем применяли к нему несколько текстур, каждая из которых покрывала всю местность. Таким образом, это выглядело очень похоже на ваше изображение из Warzone. Так что, я думаю, в three.js вы могли бы сделать то же самое — создать свой ландшафт, а затем использовать только одну текстуру, много раз оборачивая ее по осям X и Y. Для получения дополнительной помощи - вы можете предоставить пример jsfiddle того, что у вас есть прямо сейчас, чтобы мы могли вам помочь. - person Alex Under; 22.08.2013