Wie wiederhole ich die Textur wie GL_REPEAT?

Ich habe ein Hausmodell in meinem Spiel, und ich habe einige Materialien für die Hausgeometrie. Es gibt ein Material für die Wand des Hauses, und ich habe ein Textur-Map-Bild, um die Steine zu zeigen.Wie wiederhole ich die Textur wie GL_REPEAT?

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

Auf diese Weise oben, wird die Textur Karte wie GL_CLAMP ich es wie GL_REPEAT zeigen wollen.

Was soll ich tun?

Wenn Sie die Bilder nicht sehen können, überprüfen Sie this.

Quelle

2012-07-03 user1497753

Es heißt THREE.RepeatWrapping dort. Die loadTexture ist standardmäßig THREE.ClampToEdgeWrapping (siehe ctor Funktion von vorherigen Link). Ich weiß nicht, ob Sie die callback verwenden können (weil this in JS ist ein bisschen seltsam (sieht aus wie es auf die erstellte Image zeigt, nicht die erstellte Texture)). Unterschrift:

loadTexture: function (path, mapping, callback) {

Besser Sie nennen nur die Textur lokal und legen Sie die Wrap-Modi manuell:

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

Sieht aus wie du bist nicht weit mit threejs, ohne auf den eigentlichen Code gehen ...

Quelle

2012-07-03 06:48:47

Ich habe versucht, WrapS und WrapT so, aber es funktioniert nicht. Ich denke, vielleicht ist das Material falsch, jetzt verwende ich das MeshPhongMaterial, sollte ich stattdessen ShaderMaterial verwenden? – user1497753

Ich weiß nicht, ich würde versuchen, das funktioniert zu bekommen. Die Textur muss eine Zweierpotenz sein, siehe [WebGLRenderer, l. 5721] (https://github.com/mrdoob/three.js/blob/master/src/renderers/WebGLRenderer.js). –

Ich hatte ein ähnliches Problem, ich skalierte einen Würfel und die Textur wurde gestreckt. Um dies zu verhindern, müssen Sie die neue Würfelgröße in 'render()' wie folgt einstellen: 'texture.repeat.set (2 * cWidth, 2 * cHeight);' (dann verhält sich die Textur wie ein unskaliertes Muster). Ich hoffe, das hilft. –

ich habe ein voll funktionierendes Beispiel im Internet abrufbar: http://stemkoski.github.com/Three.js/Texture-Repeat.html

der relevante Teil des Codebeispiels ist:

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

Quelle

2012-07-04 12:16:35

Vielen Dank! Ich wusste, wie Textur wiederholen auf Würfel und Kugel.Aber ich habe eine andere Frage, wie man Textur wiederholen auf Geometrie Materialien? Ich habe einige geladene Modell in meinem Spiel, die Geometrie des Modells hat einige Materialien, jedes von ihnen hat unterschiedliche Textur-Bild, also könnten Sie mir einen Vorschlag oder ein Beispiel geben? Danke! – user1497753

Ich habe es. Es ist genauso! Das Bild, das ich verwendet habe, ist in einer Größe von 120 * 120, ich ändere es in 128 * 128, so dass das Problem gelöst! Vielleicht muss die Größe des Bildes bei 128 * 128 oder 256 * 256 oder etwas, wenn Sie 'wiederholen' sehen wollen – user1497753

Ja, damit die Wiederholungsfunktionen funktionieren, müssen die Bildmaße eine Stärke von 2 sein. –

Das Bild muss 8x8, 16x16, 32x32, 128x128, 256x256, 512x512 usw. werden, und alle arbeiten. =)

Quelle

2014-11-24 12:02:14 Ilya

Wrapping erfordert, dass Bilder Potenz Zwei (POT) sind, aber sie müssen nicht quadratisch sein. – WestLangley

@WestLangley du meinst ein 8x512 würde auch funktionieren? – fuchs777

@ fuchs777 Das ist richtig. – WestLangley

Wie wiederhole ich die Textur wie GL_REPEAT?

Antwort

Verwandte Themen