Three.js: Blender-Export

Blender Schlagwörter: , , 0 Kommentare
Voiced by Amazon Polly

Wer mit WebGL und der -Engine experimentieren möchte, kann sich diverser Tutorials bedienen. Ich empfehle euch in diesem r23Artikel ein Videotutorial der Fachhochschule Köln vom Studiengang der Medieninformatik.

Das Erstellen von 3D-Szenen in Three.js stellt noch eine gewisse Hürde da, denn 3D-Objekte müssen in erzeugt und animiert werden. 3D-Anwendungen wie Blender schaffen Abhilfe, denn hierfür gibt es bereits einen Three.js-Exporter, mit dem sich Szenen als JSON-Objekt exportieren lassen. Darin können auch Animationen enthalten sein.

Exportiert Three.js ASCII JSON-Format.

Empfohlene Blenderversion **> = 2.73.0 **

Kopiere den Ordner three.js/utils/exporters/blender/addons/io_three in den Ordner "scripts / addons". Der vollständige Pfad ist OS-abhängig (siehe unten).

Windows

io_three

Sollte so aussehen:

C: \ Program Files \ Blender Foundation \ Blender \ 2.7X \ scripts \ addons

OSX

In der Benutzerbibliothek für benutzerdefinierte Blender-Addons:

/ Benutzer / (myuser) / Bibliothek / Anwendungsunterstützung / Blender / 2.7X / scripts / addons

Linux

Standardmäßig sollte dies wie folgt aussehen:

/home/USERNAME/.config/blender/2.6X/scripts/addons

Für Benutzer von Ubuntu, die Blender 2.68 über apt-get installiert haben, ist dies der Speicherort:

/ Usr / lib / blender / scripts / addons verwenden

Danach müssen wir das aktivieren. Öffne Blender-Benutzereinstellungen, suche nach Addons, suche nach `three`, aktiviere das Kontrollkästchen neben dem Eintrag" Import-Export: Three.js Format ".

Blender-Benutzereinstellungen

Aktiviere das Import-Export-Addon unter "User Preferences"> "Addons" und dann verwende das reguläre Export-Menü in Blender, wähle `Three.js (json)`.

Three.js: Blender-Export

 

Die Einstellung für den Export des 3d-Models im JSON Format.

 

Aktivieren von msgpack

Um die msgpack-Komprimierung zu aktivieren, kopiere den Ordner three.js/utils/exporters/blender/modules/msgpack in den Ordner "scripts / modules".

Importeur

Derzeit ist keine Importfunktion verfügbar.

 

Videotutorial - Der Einstieg in mit dem Framework three.js

Dieses Videotutorial ist enstanden im Rahmen des Moduls Netzbasierte Anwendungen an der Fachhochschule Köln im Studiengang der Medieninformatik. Kapitelübersicht:
1. Was ist WebGL?
2. Welche Browser unterstützen WebGL?
3. Das Javascript Framework three.js für WebGL
4. 3D-Grundgerüst aufbauen mit three.js
5. Laden und anzeigen eines Collada 3D-Modells mit three.js
6. Animation des 3D-Modells mit three.js
7. Weitere Quellen rund um das Thema WebGL

 

Jetzt bist du gefragt!

Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Du kannst diesen Beitrag natürlich auch weiterempfehlen. Ich bin dir für jede Unterstützung dankbar!

Wie können wir Ihnen helfen?

Sie wollen online richtig verkaufen? Wir unterstützen Sie bei der Umsetzung Ihres Augmented Reality (AR) oder (VR) Projektes! Egal ob Produktfotografie, 3D Scan Service, 3D-Visualisierung oder fertige 3D Modelle für AR/VR – wir beraten Sie persönlich und unverbindlich.

Wünschen Sie ein individuelles Angebot auf Basis Ihrer aktuellen Vorlagen, nutzen Sie einfach unser Anfrageformular.



Gefällt Ihnen dieser Beitrag? Teilen Sie ihn mit anderen. Sie machen mir damit eine große Freude!
R23
R23

Schreibe einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Senden Sie uns Ihre Videonachricht!

Sie können im r23:Blog Ihren Textkommentar mit einer Videonachricht ergänzen! Diese Nachricht kann bis zu 90 Sekunden lang sein.

Wir freuen uns auf Sie!

Hinweis: Das r23:Blog setzt auf selbstlernende Systeme für die reale Welt.
Mit einer Künstlichen Intelligenz (KI) wird eine Abschrift von Ihrer Videonachricht erstellt.
Für ein optimales Erlebnis von r23:Blog und den dazugehörigen Applikationen wird die Verwendung von Firefox in der aktuellen Version empfohlen. Unterstützt werden weitere aktuelle Browser.

Anleitung: Videonachrichten im r23:Blog

R23

Aktuell