1. مكعب
على الرغم من أن اسم هذا الشكل هو قياس مكعب ، إلا أنه في الواقع مكعب ، أي أن الطول والعرض والارتفاع يمكن ضبطه على قيم مختلفة. مُنشئه هو:
THREE.CubeGeometry(width,height,depth,widthSegments,heightSegments, depthSegments)
العرض: الطول في الاتجاه x
الارتفاع: الطول في اتجاه y
العمق: الطول في الاتجاه z
WidthSegments: عدد الأجزاء في اتجاه X (القيمة الاختيارية ، الافتراضية 1)
المختلطات: عدد الأجزاء في اتجاه y (كما هو مذكور أعلاه)
العمق: عدد الأجزاء في اتجاه z (كما هو مذكور أعلاه)
غير مستعرض:
var material = new three.meshbasicmaterial ({color: 0xffff00 ، wireframe: true}) ؛ drawcube (مشهد ، مادة) المشهد. add (cube) ؛}الموضع الافتراضي للكائن هو الأصل ، وبالنسبة للمكعب ، موضع مركزه الهندسي في الأصل.
التجزئة:
var cube = new Three.mesh (New Three.cubegeometry (1 ، 2 ، 3 ، 2 ، 2 ، 3) ، material) ؛
لماذا يوجد الكثير من الخطوط الشريرة؟ إصدار الإصدار. نسخة R73:
لاحظ أن هذا التجزئة يزداد ستة وجوه ، بدلاً من فوكسلات المكعب ، لذلك لا يتم تقسيمها في منتصف المكعب ، ويتم تقسيم ستة جوانب فقط.
2. الطائرة
الطائرة هنا (قياس الطائرة) هي في الواقع مستطيل ، وليس مستوى من الحجم اللانهائي بالمعنى الرياضي. مُنشئه هو:
THREE.PlaneGeometry(width, height, widthSegments, heightSegments)
العرض: الطول في الاتجاه x
الارتفاع: الطول في اتجاه y
WidthSegments: عدد الأجزاء في اتجاه X (القيمة الاختيارية ، الافتراضية 1)
المختلطات: عدد الأجزاء في اتجاه y (كما هو مذكور أعلاه)
New Three.planegeometry (2 ، 4) ؛ توجد الطائرة التي تم إنشاؤها في المستوى حيث يوجد المحور السيني والمحور ص ، والتأثير على النحو التالي:
3. الكرة
مُنشئ المجال (قياس الجعة) هو:
Three.Spheregeometry (نصف قطرها ، segmentswidth ، segmentisheight ، phistart ، phistart ، thetastart ، thetalength) // RADIUS: DARIUS // segmentswidth: عدد الأجزاء على الطول // الراديوس في البداية: بداية Latitude // thetalength: دائرة نصف قطرها في بداية خط العرض
3.1 عدد شرائح خطوط الطول والخطوط
أولاً ، دعونا نفهم SegmentSwidth و SegmentSheight. استخدم var sphere = new Three.Spheregeometry (3 ، 8 ، 6) لإنشاء كرة ذات دائرة نصف قطرها 3 ، تقسيم الطول إلى 8 أجزاء وخطوط خطوط مقسمة إلى 6 أجزاء ، كما هو مبين في الشكل أدناه.
يعادل SegmentSwidth خط الطول في عدة بتلات ، في حين أن المقصورة المعادلة تعادل تقطيع خط العرض إلى عدة طبقات.
تأثير قياس ثلاثة. (3 ، 5 ، 4):
تأثير قياس ثلاثة. (3 ، 8 ، 6):
تأثير قياس ثلاثة. (3 ، 18 ، 12):
في تنفيذ الطبقة الأساسية من الرسم البياني ، لا يوجد مفهوم للمنحنيات ، وتتكون جميع المنحنيات من تقريب متعدد الخط. بالنسبة إلى المجالات ، عندما تكون هاتان القيمتان كبيرتان ، يمكن اعتبار polyhedron المكونة تقريبًا كرات.
3.2 خط الطول قوس
new THREE.SphereGeometry(3, 8, 6, Math.PI / 6, Math.PI / 3) يعني أن خط الطول البدء هو Math.PI / 6 و Lentitude Span هو Math.PI / 3.
الآثار هي كما يلي:
لاحظ أن SegmentSwidth هنا يعني أن خط الطول ينقسم إلى 8 كتل في المنطقة التي يعبر فيها Math.PI/6 Math.PI/3 ، بدلاً من خط طول المجال بأكمله مقسمة إلى 8 كتل قبل الحكم على الجزء ضمن نطاق الطول هذا.
3.3 خط العرض راديان
الأمر نفسه ينطبق على راديان خط العرض. new THREE.SphereGeometry(3, 8, 6, 0, Math.PI * 2, Math.PI / 6, Math.PI / 3) يعني أن خط العرض يمتد من Math.PI / 6 على Math.PI / 3.
الآثار هي كما يلي:
تأثير new THREE.SphereGeometry(3, 8, 6, Math.PI / 2, Math.PI, Math.PI / 6, Math.PI / 2)
4. رمز المصدر
<! doctype html> <html> <head> <meta charset = "utf-8"> <title> 3.js test 4 </title> </head> <body onload = "init ()"> <canvas id = "maincanvas"> </canvas> </body> <script type = "text/ src = "js/three.min.js"> </script> <script type = "text/javaScript"> function init () {var redererer = new Three.webglrenderer ({canvas: document.getElementById ('maincanvas')}) ؛ Renderer.setClearColor (0x0000000) ؛ var scene = new Three.scene () ؛ // camera var camera = new Three.OthographicCamera (-5 ، 5 ، 3.75 ، -3.75 ، 0.1 ، 100) ؛ camera.position.set (25 ، 25 ، 25) ؛ camera.lookat (new Three.vector3 (0 ، 0 ، 0)) ؛ المشهد. add (الكاميرا) ؛ // material var material = new three.meshbasicmaterial ({color: 0xffff00 ، wireframe: true}) ؛ DrawCube (المشهد ، المواد) ؛ // cube // drawplane (مشهد ، مادة) ؛ // plane // drawSphere (مشهد ، مادة) ؛ // Sphere // Renderer Renderer.render (المشهد ، الكاميرا) ؛ } دالة drawcube (المشهد ، المواد) {var cube = new Three.mesh (New Three.cubegeometry (1 ، 2 ، 3 ، 2 ، 2 ، 3) ، material) ؛ المشهد. Add (Cube) ؛ } دالة DrawPlane (المشهد ، المواد) {var plane = new Three.mesh (New Three.planegeometry (2 ، 4) ، material) ؛ المشهد. add (الطائرة) ؛ } دالة drawSphere (المشهد ، المادة) {var sphere = new Three.mesh (New Three.Spheregeometry (3 ، 18 ، 12) ، material) ؛ // var sphere = new Three.mesh (New Three.Spheregeometry (3 ، new Three. 0 ، Math.pi * 2 ، Math.pi / 6 ، Math.pi / 3) ، material) ؛ // var sphere = new Three.mesh (New Three.Spheregeometry (3 ، 8 ، 6 ، Math.Pi / 2 ، Math.Pi ، Math.Pi / 6 ، Math.Pi / 2) ، material) ؛ المشهد. add (المجال) ؛ } </script> </html>ما سبق هو المحتوى الكامل للأشكال الهندسية التي تعلمتها Three.js. سيقوم المحرر بتحديث المقالات حول ثلاثة. JS واحدة تلو الأخرى. يرجى الاستمرار في الانتباه إلى wulin.com.