CircleGeometry

「CircleGeometry」の編集履歴(バックアップ)一覧はこちら

CircleGeometry」(2013/04/20 (土) 11:25:27) の最新版変更点

追加された行は緑色になります。

削除された行は赤色になります。

#divclass(modif){更新日:&date(), r58} #divclass(hd){#hr()} #divid(d0){} (わかりやすくするためにワイヤーフレームも一緒に表示している。) ***説明 >&b(){THREE.CircleGeometry (} radius, segments, thetaStart, thetaLength &b(){)} 円のジオメトリを作る。 ***パラメータ :''radius'' <float>[= 50] |半径。 :''segments'' <int>[= 8] |thetaLengthで設定した角度をこの数で分割する。&br()円と言っているが3DCGでは実際のところ多角形である。thetaLengthが2π(360度まるまる)のとき、segments=6だと正6角形、segments=8だと正8角形になる。増やすにつれ真の円に近付く。 :''thetaStart'' <float>[= 0] |開始角度。単位はラジアン。+X方向が0度、+Y方向が90度。 :''thetaLength'' <float>[= 2π] |中心角。単位はラジアン。(2πでも円周の始点と終点はくっつかない。) ***例 ジオメトリ作ってマテリアルと合わせてメッシュにしてシーンに追加するまで。 var circleGeo = new THREE.CircleGeometry(10, 16), // 半径10、正16角形 var greenMaterial = new THREE.MeshLambertMaterial( { color: 0x00ff00 } ); var circle = new THREE.Mesh( circleGeo, greenMaterial ); scene.add( circle ); // circle.geometry.computeVertexNormals(); r57以前でのバグ対策。r58以降は不要。 ***etc -何も設定しないとオモテ面だけなので裏返ると全く見えなくなる(上の表示例ではワイヤーフレームも一緒に出してるので見えるが)。 ---- #divid(d1){} (わかりやすくするためにワイヤーフレームも一緒に表示している。) 前述したように正多角形もこのジオメトリで作れる。 普通に正5角形とか作ると+X向きになるので、この時点で90度回して頂点位置を書き変えておくと後々便利かもしれない(それに従って+Y方向が0度になる)。 var regularPolygon = new THREE.Mesh( new THREE.CircleGeometry(10,5), new THREE.MeshLambertMaterial( { color: 0x00ff00 } ) ); scene.add( regularPolygon ); for(var i=1, len = regularPolygon.geometry.vertices.length; i<len; i++){ regularPolygon.geometry.vertices[i].applyAxisAngle({x:0, y:0, z:1}, Math.PI/2); // Z軸で90度回転 } // polygon.geometry.computeVertexNormals(); r57以前でのバグ対策。r58以降は不要。 #include(-g_circle) #include(-g_circle2) //.
#divclass(modif){更新日:&date(), r58} #divclass(hd){#hr()} #divid(d0){} (わかりやすくするためにワイヤーフレームも一緒に表示している。) ***説明 >&b(){THREE.CircleGeometry (} radius, segments, thetaStart, thetaLength &b(){)} 円のジオメトリを作る。 ***パラメータ :''radius'' <float>[= 50] |半径。 :''segments'' <int>[= 8] |thetaLengthで設定した角度をこの数で分割する。&br()円と言っているが3DCGでは実際のところ多角形である。thetaLengthが2π(360度まるまる)のとき、segments=6だと正6角形、segments=8だと正8角形になる。増やすにつれ真の円に近付く。 :''thetaStart'' <float>[= 0] |開始角度。単位はラジアン。+X方向が0度、+Y方向が90度。 :''thetaLength'' <float>[= 2π] |中心角。単位はラジアン。(2πでも円周の始点と終点はくっつかない。) ***例 ジオメトリ作ってマテリアルと合わせてメッシュにしてシーンに追加するまで。 var circleGeo = new THREE.CircleGeometry(10, 16), // 半径10、正16角形 var greenMaterial = new THREE.MeshLambertMaterial( { color: 0x00ff00 } ); var circle = new THREE.Mesh( circleGeo, greenMaterial ); scene.add( circle ); // circle.geometry.computeVertexNormals(); // r57以前でのバグ対策。r58以降は不要。 ***etc -何も設定しないとオモテ面だけなので裏返ると全く見えなくなる(上の表示例ではワイヤーフレームも一緒に出してるので見えるが)。 ---- #divid(d1){} (わかりやすくするためにワイヤーフレームも一緒に表示している。) 前述したように正多角形もこのジオメトリで作れる。 普通に正5角形とか作ると+X向きになるので、この時点で90度回して頂点位置を書き変えておくと後々便利かもしれない(それに従って+Y方向が0度になる)。 var regularPolygon = new THREE.Mesh( new THREE.CircleGeometry(10,5), new THREE.MeshLambertMaterial( { color: 0x00ff00 } ) ); scene.add( regularPolygon ); for(var i=1, len = regularPolygon.geometry.vertices.length; i<len; i++){ regularPolygon.geometry.vertices[i].applyAxisAngle({x:0, y:0, z:1}, Math.PI/2); // Z軸で90度回転 } // polygon.geometry.computeVertexNormals(); // r57以前でのバグ対策。r58以降は不要。 #include(-g_circle) #include(-g_circle2) //.

表示オプション

横に並べて表示:
変化行の前後のみ表示: