|
@@ -0,0 +1,131 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="ar">
|
|
|
+ <head>
|
|
|
+ <meta charset="utf-8" />
|
|
|
+ <base href="../../../" />
|
|
|
+ <script src="page.js"></script>
|
|
|
+ <link type="text/css" rel="stylesheet" href="page.css" />
|
|
|
+ </head>
|
|
|
+ <body class="rtl">
|
|
|
+ [page:BufferGeometry] →
|
|
|
+
|
|
|
+ <h1>[name]</h1>
|
|
|
+
|
|
|
+ <p class="desc">ينشئ هندسة مُبثوقة من شكل المسار.</p>
|
|
|
+
|
|
|
+ <iframe
|
|
|
+ id="scene"
|
|
|
+ src="scenes/geometry-browser.html#ExtrudeGeometry"
|
|
|
+ ></iframe>
|
|
|
+
|
|
|
+ <script>
|
|
|
+
|
|
|
+ // iOS iframe auto-resize workaround
|
|
|
+
|
|
|
+ if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
|
|
|
+
|
|
|
+ const scene = document.getElementById( 'scene' );
|
|
|
+
|
|
|
+ scene.style.width = getComputedStyle( scene ).width;
|
|
|
+ scene.style.height = getComputedStyle( scene ).height;
|
|
|
+ scene.setAttribute( 'scrolling', 'no' );
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ </script>
|
|
|
+
|
|
|
+ <h2>مثال الكود</h2>
|
|
|
+
|
|
|
+ <code>
|
|
|
+ const length = 12, width = 8;
|
|
|
+
|
|
|
+ const shape = new THREE.Shape();
|
|
|
+ shape.moveTo( 0,0 );
|
|
|
+ shape.lineTo( 0, width );
|
|
|
+ shape.lineTo( length, width );
|
|
|
+ shape.lineTo( length, 0 );
|
|
|
+ shape.lineTo( 0, 0 );
|
|
|
+
|
|
|
+ const extrudeSettings = {
|
|
|
+ steps: 2,
|
|
|
+ depth: 16,
|
|
|
+ bevelEnabled: true,
|
|
|
+ bevelThickness: 1,
|
|
|
+ bevelSize: 1,
|
|
|
+ bevelOffset: 0,
|
|
|
+ bevelSegments: 1
|
|
|
+ };
|
|
|
+
|
|
|
+ const geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
|
|
|
+ const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
|
|
|
+ const mesh = new THREE.Mesh( geometry, material ) ;
|
|
|
+ scene.add( mesh );
|
|
|
+ </code>
|
|
|
+
|
|
|
+ <h2>المنشئ (Constructor)</h2>
|
|
|
+
|
|
|
+ <h3>[name]([param:Array shapes], [param:Object options])</h3>
|
|
|
+ <p>
|
|
|
+ shapes — شكل أو مصفوفة من الأشكال. <br />
|
|
|
+ options — كائن يمكن أن يحتوي على المعلمات التالية.
|
|
|
+ </p>
|
|
|
+
|
|
|
+ <ul>
|
|
|
+ <li>
|
|
|
+ curveSegments — int. عدد النقاط على المنحنيات. الافتراضي هو 12.
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ steps — int. عدد النقاط المستخدمة لتقسيم الشرائح على طول
|
|
|
+ عمق المنحنى المبثوق. الافتراضي هو 1.
|
|
|
+ </li>
|
|
|
+ <li>depth — float. عمق لإبعاد الشكل. الافتراضي هو 1.</li>
|
|
|
+ <li>
|
|
|
+ bevelEnabled — bool. تطبيق التجعيد على الشكل. الافتراضي هو true.
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ bevelThickness — float. مدى اختراق التجعيد في الشكل الأصلي.
|
|
|
+ الافتراضي هو 0.2.
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ bevelSize — float. المسافة من مخطط الشكل التي يمتد فيها التجعيد.
|
|
|
+ الافتراضي هو bevelThickness - 0.1.
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ bevelOffset — float. المسافة من مخطط الشكل التي يبدأ فيها التجعيد.
|
|
|
+ الافتراضي هو 0.
|
|
|
+ </li>
|
|
|
+ <li>bevelSegments — int. عدد طبقات التجعيد. الافتراضي هو 3.</li>
|
|
|
+ <li>
|
|
|
+ extrudePath — THREE.Curve. مسار منحنى ثلاثي الأبعاد يجب أن يتم إبعاد
|
|
|
+ الشكل على طوله. لا يتم دعم التجعيد لإبعاد المسار.
|
|
|
+ </li>
|
|
|
+ <li>UVGenerator — Object. كائن يوفر وظائف مولد UV</li>
|
|
|
+ </ul>
|
|
|
+
|
|
|
+ <p>هذا الكائن يبعد شكل ثنائي الأبعاد إلى هندسة ثلاثية الأبعاد.</p>
|
|
|
+
|
|
|
+ <p>
|
|
|
+ عند إنشاء شبكة بهذه الهندسة، إذا كنت ترغب في استخدام مادة منفصلة لوجهها
|
|
|
+ وجوانبها المبثوقة، يمكنك استخدام مصفوفة من المواد. سيتم تطبيق المادة
|
|
|
+ الأولى على الوجه؛ سيتم تطبيق المادة الثانية على الجانب.
|
|
|
+ </p>
|
|
|
+
|
|
|
+ <h2>الخصائص (Properties)</h2>
|
|
|
+ <p>انظر فئة [page:BufferGeometry] الأساسية للخصائص المشتركة.</p>
|
|
|
+
|
|
|
+ <h3>[property:Object parameters]</h3>
|
|
|
+ <p>
|
|
|
+ كائن يحتوي على خاصية لكل من معلمات المنشئ. أي تعديل بعد التجسيد لا يغير
|
|
|
+ الهندسة.
|
|
|
+ </p>
|
|
|
+
|
|
|
+ <h2>الطرق (Methods)</h2>
|
|
|
+ <p>انظر فئة [page:BufferGeometry] الأساسية للطرق المشتركة.</p>
|
|
|
+
|
|
|
+ <h2>المصدر (Source)</h2>
|
|
|
+
|
|
|
+ <p>
|
|
|
+ [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
|
|
|
+ </p>
|
|
|
+ </body>
|
|
|
+</html>
|