Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- api:documentation:grafik3d:materialien:start [2025/03/04 15:10] – martin
+++ api:documentation:grafik3d:materialien:start [2025/03/04 17:01] (aktuell) – [Materialien] martin
@@ Zeile 7: / Zeile 7: @@
   * **PhysicallyBasedMaterial** -> recht rechenintensiv; ermöglicht sowohl matte als auch glänzende Oberflächen
+Genaugenommen ist ein "Material" ein Programm für den Fragment Shader der Grafikkarte, das die Farbe eines Fragments ( == eines Pixels am Bildschirm) in Abhängigkeit von den Lichtquellen, der Position und Richtung der Oberfläche und den Parametern des "Materials" berechnet.
 </WRAP>
@@ Zeile 17: / Zeile 17: @@
 <HTML>
-<div class="java-online" style="height: 300px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': '3d-base-objects', 'enableFileAccess': true}">
+<div class="java-online" style="height: 300px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': '3d-BasicMaterial3d', 'enableFileAccess': true}">
 <script type="text/plain" title="Test1.java">
-Box3d box1 = new Box3d(0.5, 1, 0.5);
+Torus3d t1 = new Torus3d();
-box1.move(0, 0.5, -1);
+BasicMaterial3d m1 = new BasicMaterial3d(0x0000ff);
+m1.setAlpha(0.5);
+t1.setMaterial(m1);
-Box3d box2 = new Box3d(1, 1, 0.5, 2, 4, 2);
+Torus3d t2 = new Torus3d(2, 0.5, 16, 100, 270);
-box2.move(-1, 1, 1);
+t2.move(-2, 0, -1);
-box2.getMaterial().setColor(0x5050ff).setWireframe(true);
+t2.rotateY(200);
+t2.rotateX(90);
-Box3d box3 = new Box3d();
+BasicMaterial3d m2 = new BasicMaterial3d(0x808000);
-box3.getMaterial().setColor(0xff0000).setAlpha(0.6);
+m2.setAlpha(0.5);
+t2.setMaterial(m2);
+t2.enableFrontBackSide(true, true);
+</script>
+</div>
+</HTML>
+==== LambertMaterial3d ====
+<WRAP center round tip 80%>
+Dieses Material ist wenig rechenintensiv, berücksichtigt Lichtquellen und erzeugt Oberflächen, die matt erscheinen. Wird eine Fläche nicht von Licht beschienen, so erscheint sie schwarz. Es empfiehlt sich, [[api:documentation:grafik3d:licht:start#AmbientLight3d|Umgebungslicht (AmbientLight3D)]] zusätzlich zu anderen Lichtquellen zu verwenden. [[https://threejs.org/docs/#api/en/materials/MeshLambertMaterial|Hier die Dokumentation zu Lambertmaterial auf den Seiten von three.js]].
+</WRAP>
+<HTML>
+<div class="java-online" style="height: 300px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': '3d-LambertMaterial3d', 'enableFileAccess': true}">
+<script type="text/plain" title="Test1.java">
+Torus3d t1 = new Torus3d();
+LambertMaterial3d m1 = new LambertMaterial3d(0x0000ff);
+t1.setMaterial(m1);
+Torus3d t2 = new Torus3d(2, 0.5, 16, 100, 270);
+t2.move(-2, 0, -1);
+t2.rotateY(200);
+t2.rotateX(90);
+LambertMaterial3d m2 = new LambertMaterial3d(0x808000);
+m2.setAlpha(0.5);
+t2.setMaterial(m2);
+t2.enableFrontBackSide(true, true);
 </script>
@@ Zeile 35: / Zeile 69: @@
 </HTML>
+==== PhongMaterial3d ====
+<WRAP center round tip 80%>
+Dieses Material ist ähnlich rechenintensiv wie LambertMaterial, berücksichtigt ebenfalls Lichtquellen, erzeugt aber glänzend erscheinende Oberflächen. Wird eine Fläche nicht von Licht beschienen, so erscheint sie schwarz. Es empfiehlt sich, [[api:documentation:grafik3d:licht:start#AmbientLight3d|Umgebungslicht (AmbientLight3D)]] zusätzlich zu anderen Lichtquellen zu verwenden. [[https://threejs.org/docs/#api/en/materials/MeshPhongMaterial|Hier die Dokumentation zu PhongMaterial auf den Seiten von three.js]].
+</WRAP>
+<HTML>
+<div class="java-online" style="height: 300px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': '3d-PhongMaterial3d', 'enableFileAccess': true}">
+<script type="text/plain" title="Test1.java">
+Torus3d t1 = new Torus3d();
+PhongMaterial3d m1 = new PhongMaterial3d(0x0000ff);
+m1.setShininess(80);
+t1.setMaterial(m1);
+Torus3d t2 = new Torus3d(2, 0.5, 16, 100, 270);
+t2.move(-2, 0, -1);
+t2.rotateY(200);
+t2.rotateX(90);
+PhongMaterial3d m2 = new PhongMaterial3d(0x808000);
+m2.setAlpha(0.5);
+t2.setMaterial(m2);
+t2.enableFrontBackSide(true, true);
+</script>
+</div>
+</HTML>
+==== PhysicallyBasedMaterial3d ====
+<WRAP center round tip 80%>
+Dieses Material ist recht rechenintensiv und ermöglicht sowohl glänzende als auch matte Oberflächen. [[https://threejs.org/docs/#api/en/materials/MeshPhysicalMaterial|Hier die Dokumentation zu PhysicallyBasedMaterial auf den Seiten von three.js]].
+</WRAP>
+<HTML>
+<div class="java-online" style="height: 300px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': '3d-PhysicallyBasedMaterial3d', 'enableFileAccess': true}">
+<script type="text/plain" title="Test1.java">
+Torus3d t1 = new Torus3d();
+PhysicallyBasedMaterial3d m1 = new PhysicallyBasedMaterial3d(0x0000ff, 0.4, 1);
+t1.setMaterial(m1);
+Torus3d t2 = new Torus3d(2, 0.5, 16, 100, 270);
+t2.move(-2, 0, -1);
+t2.rotateY(200);
+t2.rotateX(90);
+PhysicallyBasedMaterial3d m2 = new PhysicallyBasedMaterial3d(0x808000, 1, 0);
+t2.setMaterial(m2);
+t2.enableFrontBackSide(true, true);
+</script>
+</div>
+</HTML>