3.1基本的なジオメトリ
トーラス（TorusGeometry）
コンストラクタ
THREE.TorusGeometry（半径、チューブ、radialSegments、tubularSegments、アーク）
半径：リングの半径。
チューブ：パイプの半径。
radialSegmentsは、以下の図を参照して、2およびセグメントtubularSegmentsの数です。
円弧の曲率は、デフォルトにMath.PI * 2トーラスです。
標準リングとデモコードレンダリング
1 <！DOCTYPE HTML > 2 < HTML のlang = "EN" > 3 4 < ヘッド> 5 < メタのcharset = "UTF-8" > 6 < メタ名= "ビューポート" コンテンツ= "幅=デバイス幅、初期スケール= 1.0 " > 7 < メタHTTP-当量=" X-UA-互換」コンテンツ= "IE =縁" > 8 < スクリプトタイプ= "テキスト/ javascriptの"> 9 < タイトル>ドキュメント</ タイトル> 10 </ ヘッド> 11 12 < 本体のonload = "INIT（）" > 13 < スクリプト> 14 関数のinit（）{ 15 VARのレンダラ= 新しいTHREE.WebGLRenderer（）。 16 renderer.setSize（800 、600 ）。 17 document.getElementsByTagName（' ボディ' ）[ 0] .appendChild（renderer.domElement）。 18 renderer.setClearColor（0×000000 ）。 19 20 のvar シーン= 新しいTHREE.Scene（）; 21 VaRの態様= window.innerWidth / window.innerHeight。 22 VaRのカメラ= 新しいTHREE.OrthographicCamera（- 4 * 側面、4 * 局面、- 3 * 態様、3 * 態様、1 、1000年）。 23 camera.position.set（200 、200 、200 ）。 24 camera.lookAt（新しいTHREE.Vector3（0 、0 、0 ））; 25 scene.add（カメラ）。 26の 27 のvar トーラス= 新しいTHREE.Mesh（新しいTHREE.TorusGeometry（5 、1 、25 、80 ）、 28 新しいTHREE.MeshBasicMaterial（{ 29 色：は0xFF0000 、 30 ワイヤーフレーム：真 31 }） 32 ） 33 scene.add（トーラス）。 34 35 renderer.render（シーン、カメラ）。 36 } 37 </ スクリプト> 38 </ ボディ> 39 40 </ HTML >
非フルリングやコードサンプルデモの影響
1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 8 <script type="text/javascript" src="./three.js"></script> 9 <title>Document</title> 10 </head> 11 12 <body onload="init()"> 13 <script> 14 function init() { 15 var renderer = new THREE.WebGLRenderer(); 16 renderer.setSize(800, 600); 17 document.getElementsByTagName('body')[0].appendChild(renderer.domElement); 18 renderer.setClearColor(0x000000); 19 20 var scene = new THREE.Scene(); 21 var aspect = window.innerWidth / window.innerHeight; 22 var camera = new THREE.OrthographicCamera(-4 * aspect, 4 * aspect, -3 * aspect, 3 * aspect, 1, 1000); 23 camera.position.set(100, 200, 200); 24 camera.lookAt(new THREE.Vector3(0, 0, 0)); 25 scene.add(camera); 26 27 var torus = new THREE.Mesh(new THREE.TorusGeometry(5, 1, 25, 80, Math.PI * 3 / 2), 28 new THREE.MeshBasicMaterial({ 29 color: 0xff0000, 30 wireframe: true 31 }) 32 ) 33 scene.add(torus); 34 35 renderer.render(scene, camera); 36 } 37 </script> 38 </body> 39 40 </html>
