THREE.js hat eine einfache Möglichkeit, tga oder dds Dateien als Texturen zu laden, wenn man obj + Dateien lädt.Wie man mehrere jpg Texturdateien lädt THREE.js mit obj + mtl
für ex in ihrem obj + mtl Beispiel (https://threejs.org/examples/#webgl_loader_obj_mtl):
// this line adds all the tga texture files
THREE.Loader.Handlers.add(/\.tga$/i, new THREE.TGALoader());
Aber, meine Texturdateien sind jpg. WIE lade ich sie? Mir wurde gesagt, dass ich TextureLoader benutzen kann, aber es funktioniert nicht auf die gleiche Weise, denke ich? Was ist das richtige Format? Weil die Texturen immer noch nicht auftauchen.
dies ist mein Code:
THREE.Loader.Handlers.add(/\.jpg$/i, new THREE.TextureLoader());
var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath('assets/sac_grain/bag_of_grain/');
mtlLoader.load('sg1.mtl', function(materials) {
console.log('mats', materials);
materials.preload();
var objLoader = new THREE.OBJLoader();
objLoader.setMaterials(materials);
objLoader.setPath('assets/sac_grain/bag_of_grain/');
objLoader.load('sg1.obj', function (object) {
object.position.y = 10;
object.position.x = -10;
scene.add(object);
}, onProgress, onError);
});
Als ich an Materialien in der Konsole sehen, die materialArray ist leer, aber materialsInfo zeigt, dass Materialien, die die Informationen aus der mtl Datei erhalten haben.
lsArray:Array(0)
materialsInfo:Object
default10:Object
d:"1.0"
illum:"2"
ka:Array(3)
kd:Array(3)
ke:"0.0 0.0 0.0"
ks:Array(3)
map_kd:"textures/burlap.jpg"
name:"default10"
ns:"100.0"
... etc ...
Jede Hilfe würde sehr geschätzt werden, ich bin seit ein paar Tagen auf diesem festgefahren.
Hier ist meine mtl Datei:
# Exported from Wings 3D 1.4.1
newmtl default10
Ns 100.0
d 1.0
illum 2
Kd 1.0 1.0 1.0
Ka 1.0 1.0 1.0
Ks 1.0 1.0 1.0
Ke 0.0 0.0 0.0
map_Kd burlap.jpg
newmtl default11
Ns 100.0
d 1.0
illum 2
Kd 1.0 1.0 1.0
Ka 1.0 1.0 1.0
Ks 1.0 1.0 1.0
Ke 0.0 0.0 0.0
map_Kd grains.jpg
Es sieht so aus, als ob Ihre Materialien den Pfad als Texturen/burlap.jpg angeben. Wenn der Pfad in Wirklichkeit Assets/sac_grain/bag_of_grain/textures/burlap.jpg lautet, müssen Sie die mtl-Datei entsprechend anpassen. Dies ist keine Einschränkung von three.js, sondern die Verwendung von OBJ-Dateien im Internet. – Radio
@Radio - danke für die Hilfe. Ich muss den vollständigen Pfad zu der jpg-Datei in der Mtl-Datei haben? Gibt es eine Möglichkeit, nur einen relativen Pfad zu verwenden? – aeiou
Der mtlLoader ist nicht Teil des Basis-Builds von Three.js. Es ist ein Beispiel dafür, wie Assets in three.js geladen werden. Daher ist es am besten, sich den Code anzuschauen. Zum Beispiel ist der MTL Loader hier: https://github.com/mrdoob/three.js/blob/dev/examples/js/loaders/MTLLoader.js Eine kurze Studie der Klasse zeigt, dass der Autor für die Situation gesorgt hat durch Bereitstellung von Funktionalität und einer kurzen Erklärung in Zeile 61 ab R85. – Radio