Ich möchte einen Online-Viewer erstellen, in dem ein Benutzer Modelle hochladen und anzeigen kann, anstatt den Pfad im Quellcode bearbeiten zu müssen. Da Browser nicht erlauben, Dateipfad abzurufen, aber ich kann den Inhalt der Datei lesen, wie lade ich ein Modell (Obj, Ply, Mtl usw.) angesichts der Inhalte der Datei?Wie lade ich 3D-Modelle, die den Dateiinhalt und nicht den Pfad in three.js angeben?
Antwort
Es gibt ein paar Möglichkeiten, aber wenn Sie zum Repository github three.js gehen, sehen Sie in den Beispielen einen obj loader. Es gibt Beispiele mit mtl, stl, collada usw.
http://threejs.org/examples/webgl_loader_obj.html
Das Repository hat die Beispiele Ordner, die einen js Ordner mit all Beispiel Lader hat:
https://github.com/mrdoob/three.js/tree/master/examples/js/loaders
Wenn Sie möchten, Um den internen Lader drei zu untergraben, hat jedes Loader-Beispiel eine Parse (Text) -Methode.
Nun gerade herausgefunden, dass der three.js Online-Editor tut dies @http://threejs.org/editor/.
Datei -> Importieren.
Sie können verwenden und dann können Sie Parse-Methode vom entsprechenden Loader direkt mit dem Ergebnis aufrufen.
Oder Sie können den Datei-Reader verwenden, lesen Sie die Datei in eine Daten-URL und laden Sie die Daten-URL anstelle Ihrer normalen URL.
HTML-Code erlaubt Benutzer die Modelldatei
<h1>Model File Reader</h1>
<div>
Select a model file:
<input type="file" id="fileInput">
</div>
Javascript-Code zu laden, das onload Ereignis zu behandeln:
window.onload = function() {
var fileInput = document.getElementById('fileInput');
fileInput.addEventListener('change', function(e) {
// file selection is done you can now read the file
var file = this.files[0];
// set your file encoding
var encoding = 'ISO-8859-1';
// create a file reader
var reader = new FileReader();
// set on load handler for reader
reader.onload = function(e) {
var result = reader.result;
// parse using your corresponding loader
loader.parse(result);
}
// read the file as text using the reader
reader.readAsText(file, encoding);
});
}
prüfen here für weitere Informationen über die Datei Leserklasse
Ja, das weiß ich. Die verwendete Konvention ist 'loader.load (url, ..)', wobei loader für Obj, Ply, Fbx sein könnte. Aber ich habe nicht die URL beim Hochladen einer Datei in den Browser, sondern nur den Inhalt der Datei. Wie rufe ich diese Funktion und mit welchen Argumenten auf? –
Die meisten Lader haben eine Analyse-Methode. Sie können es direkt verwenden https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/OBJLoader.js#L300 – yomotsu
Ja, verwenden Sie die Parse-Methode. ^ – Radio