2016-07-21 17 views
0

Ich habe ein Mesh, das durch Extrusion eines PNG-Bild erstellt wird. Ich habe auf den Code http://wizgrav.github.io/three.js/runner/ verwiesen. Ich verwende ein THREE.MeshPhongMaterial zum Mesh. Ich verwende eine Textur Map, aber die Textur wird nur auf der Vorderseite und der Rückseite des Mesh und nicht auf den Seiten angewendet. Bitte sehen Sie sich das beigefügte Bild unten an.Textur nicht auf den Seiten in Three.js

enter image description here

Die Seiten nehmen die dunkelste Farbe der Textur.

Ich ging zu threejs.org/editor und fügte einen einfachen Würfel hinzu und wendete das gleiche THREE.MeshPhongMaterial Material mit der gleichen Textur an und es wurde auf allen Seiten des Würfels angewendet. Aber in meinem Fall ist die Textur nicht an den Seiten aufgetragen.

Code:

var texture = THREE.ImageUtils.loadTexture('/Content/texture-green.jpg'); 
var bumpTexture = THREE.ImageUtils.loadTexture('/Content/texture-green-bump.jpg'); 
var specularTexture = THREE.ImageUtils.loadTexture('/Content/texture-green-specular.jpg'); 

var material = new THREE.MeshPhongMaterial({ 
    map: texture, 
    bumpMap: bumpTexture, 
    bumpScale: 0.03, 
    specularMap: specularTexture 
}); 

var g = new THREE.CanvasGeometry(canvas, { "height": 0.1, "solid": solid, "offset": window.thr, "steps": (steps ? Math.abs(steps) : 5) }); 
g.center(); 
mesh = new THREE.Mesh(g, material); 
scene.add(mesh); 

Also, gibt es ein Problem in die Art und Weise die Geometrie gebildet wird (http://wizgrav.github.io/three.js/runner/CanvasGeometry.js)? Oder gibt es eine andere Möglichkeit, den Seiten des Netzes Texturen hinzuzufügen?

Vielen Dank.

+0

Ich sehe zumindest Streifen der Textur auf der Seite, Es ist ein UV-Textur-Map-Problem, da der Code diesen Läufer erzeugt, müssen Sie nach einer Möglichkeit suchen, um die UV umwickeln. http://stackoverflow.com/questions/19891507/correct-uv-mapping-three-js Ich hoffe, dass dieser Link hilft. –

+0

@LeroyThompson Danke Mann für Ihre Hilfe. Ich bin durch den Link gegangen, aber es hat mir nicht geholfen. Diese http://stackoverflow.com/a/27317936/5275732 war genau das, was ich suchte und es funktionierte für mich. –

Antwort

1

Ich folgte this Link und es funktionierte für mich. Ich musste ein paar kleine Änderungen an der Textur vornehmen, um es richtig zu machen.

Hoffe, das hilft auch jemand.

+0

Ich bin froh, dass ich ein bisschen geholfen habe, ich mag diese Umhüllungsmethode. –