3D – Darstellungen im Webbrowser

Blender Schlagwörter: 0 Kommentare

VRML: Cosmo Player 2.0 fertig lautet am 22.12.1997 die Schlagzeile bei Heise. Wenige Monate später wurde der Webbrowser Netscape Navigator der mit einem VRML-PlugIn (CosmoPlayer) ausgeliefert. Im Browserkrieg wurde die Integration von Java im Browser eingestellt und Netscape gab auf und stellte den Quellcode des Navigator unter Open Source. Damit gab es praktisch keine standardisierten Möglichkeiten mehr im Browser VRML Welten darzustellen.

Am Montag habe ich euch meine Skulptur: Liegende Figur 2015 in einer Animation bereits gezeigt.

 

Wir visualisieren Ideen!

R23 ist Ihre Digitalagentur für Virtual & Augmented Reality. Wir investieren in immersive Technologien wie Augmented Reality und künstliche Intelligenz, die die Grundlage für die Art und Weise sein werden, wie wir in Zukunft online einkaufen. Mit neuen visuellen Entdeckungstools helfen wir Käufer:innen, neue Produkte zu finden, und mit AR-Erlebnissen helfen wir Menschen, Artikel zu visualisieren, bevor sie sie kaufen.
Charakterdesign / Maskottchen

Fotorealistische Visualisierungen und 3D-Animationen lassen sich schnell und kostengünstig erzeugen und in Ihrem Online-Shop veröffentlichen.

And now, what you buy is what you see!

Der verwendete -Viewer bietet eine extrem realistische Visualisierung meiner Skulptur. Der 3D-Viewer ist mit allen Standardtechnologien kompatibel: Java, Flash und JavaScript, je nach Konfiguration deines Computers. Außerdem lässt sich der 3D-Viewer ebenso einfach wie ein YouTube-Video in Deinen Blog oder Deiner Webseite integrieren. Wenn ihr noch mehr erfahren möchtet, besucht meinen Entwurf bei Sculpteo.

Mit WebGL und dem API x3dom sind nun wieder standardisierte -Modelle im Browser möglich. Und das Ganze funktioniert sogar ohne PlugIn in aktuellen Browsern.

WebGL

WebGL steht für Web Graphics Library (englisch für Web-Grafik-Bibliothek) und ist ein Bestandteil von Webbrowsern, mit dessen Hilfe hardwarebeschleunigte -Grafiken direkt im Browser – ohne zusätzliche Erweiterungen – dargestellt werden können.

WebGL ist eine -Grafik-Programmierschnittstelle für Webbrowser, auf der Basis von OpenGL ES (Version 2.0) im Zusammenspiel mit der Programmiersprache JavaScript, die von der Khronos Group und Mozilla als lizenzfreier Standard entwickelt wird. Die Arbeiten an dem Projekt wurden im April 2009 begonnen. Im Mai 2010 wurde bekannt gegeben, dass die Firma Google den Standard ebenfalls unterstützen wird.

Erste Implementierungen von WebGL wurden in den Rendering-Engines WebKit und Gecko realisiert. Zudem haben sich bereits seit August 2009 die IT-Unternehmen AMD, Ericsson, Nvidia und Opera an der Entwicklung des Projektes beteiligt.

Am 3. März 2011 wurde die erste Version der WebGL-Spezifikation auf der Game Developers Conference in San Francisco freigegeben. Im März 2011 wurde WebGL von Googles Webbrowser Chrome und Mozillas Firefox unterstützt und ansonsten in Browser-Vorabversionen von Safari und Opera standardmäßig aktiviert.

WebGL Ressourcen

WebGL Spezifikation
Der Entwurf der WebGL Spezifikation.

Khronos WebGL Seite
Die Hauptseite für WebGL der Khronos Group.

Learning WebGL
Eine Reihe von Tutorials über WebGL (Englisch).

Das WebGL Kochbuch
Rezepte für das Schreiben von WebGL-Code (Englisch).

Sylvester
Eine Open-Source Bibliothek, die das Verarbeiten von Vektoren und Matrizen erleichtert.

Planet WebGL
Eine Feed-Sammlung von Leuten, die in der WebGL Community aktiv sind.

x3dom

Ist ein Wrapper, der X3d in WebGL übersetzt.

Sehr professionelle, effiziente und einfache Schnittstelle zwischen WebGL und X3D. Extensible 3D, kurz X3D, ist eine auf XML (XML-Encoding, Datei-Endung .x3d) basierende Beschreibungssprache für -Modelle, die in einem Webbrowser angezeigt werden können. X3D wird durch das Web3D Consortium betreut und wurde im Jahre 2001 vom W3C-Konsortium als offizieller Standard für -Inhalte im verabschiedet. Es wurde als Nachfolger von VRML 2.0 eingeführt. Entwickelt wird x3Dom vom Fraunhofer IGD, Darmstadt.

Es müssen folgende Dateien im gleichen Ordner gespeichert sein:

x3dom.js
x3dom.css
x3dom.swf

Erster Versuch

Erster Versuch
https://blog.r23.de/3d/x3dom/02122015/moore.html

Navigationshilfe

-Modell drehen: Drücken der linken Maustaste und bewegen der Maus
Vergrößern/Verkleinern: Mausrad drehen oder rechte Maustaste gedrückt halten und Maus bewegen
Verschieben: Strg-Taste und eine Maustaste gedrückt halten und die Maus bewegen

Die Oberfläche ist noch sehr dunkel. Die Skulptur dreht sich nicht. Je nach Navigation Mode verschwindet die Skulptur vom Monitor.

XML3D

Mit XML3D sollen sich künftig dreidimensionale Grafiken direkt in Webseiten einbetten und mit HTML beschreiben lassen. Dargestellt werden sie entweder als Raster oder per Echtzeit-Raytracing.

Für Blender gibt es eine Erweiterung.

https://github.com/ksons/xml3d-blender-exporter

Erster Versuch

erster Versuch

https://blog.r23.de/3d/xml3d/02122015/moore.html

Die Oberfläche ist noch sehr dunkel. Vergrößern/Verkleinern ist leider nicht möglich.

Three.js

Three.js ist eine umfangreiche JavaScript API mit der man Szenen, Kameras, Objekte, Lichter, Materialien und mehr im Browser erstellen kann. Three.js verfolgt den Ansatz, die Komplexität auf ein verständliches Level zu reduzieren. Unternehmen und Entwickler interaktiver Websites setzen immer öfter auch auf die vielseitigen Möglichkeiten und Vorteile, die three.js bietet.

Für Blender gibt es eine Erweiterung
https://github.com/mrdoob/three.js/tree/master/utils/exporters/blender

blender_erweitern

Wie können wir Ihnen helfen?

Wir unterstützen Sie bei der Umsetzung Ihres Augmented Reality (AR) oder Virtual Reality (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.



Hat Ihnen dieser Artikel gefallen?

Mit Ihrer Bewertung helfen Sie uns, unsere Inhalte noch weiter zu verbessern.

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

Kommentar

Möchten Sie mitdiskutieren?
Hinterlassen Sie einen Kommentar!

Ihre E-Mail-Adresse wird nicht veröffentlicht.

R23

Aktuell