Three JS:Geometryでオリジナルの形状を作ってみる
今まで当ブログでthree.jsの基本的な扱い方を勉強してきましたが、もっと基礎的な部分を固める為に自作でGeometry(形状)を作ってみたいと思います。まずは簡単な所で、今回は下のようなただの八面体の作り方を説明します。 Geometryとは 3D空間の中の物体は基本的に頂点(vertice)とその頂点を繋げた三角形の面(face)の集合で成り立っています。three.jsのプリセットに含まれているTorusKnotGeometry(輪環結び目)のような複雑な形状のものも同じく、ワイヤーフレームを表示させてみると三角形の集合だと言う事が分かります。 その頂点と三角形の面を一つ一つ指定して一つのGeometryが形成されます。 Geometryを作ってみる それでは早速、自作でのGeometryの形成の仕方を説明します。 まずはnew THREE.Geometry()によりGeometr
three.js の PlaneGeometry で地形を作る | Yomotsu net
GraphicalWeb Advent Calendar 2012 の 1日目の記事です。 この記事では、three.js の PlainGeometry の頂点の z 方向にノイズを加えて、少し凸凹とした地形を作ってみるという内容をまとめています。完成は以下のような表示です。 なお、demo は WebGL が有効なブラウザー (Chrome, Firefox と Flag を有効にした Opera と Safari) でしか再生できません。 順を追ってみていきます。 ##手順 1 まずは three.js のお決まりに沿って、renderer, scene, camera, light を設置していきます。 scene に fog を指定しておくと遠方が指定した色にぼやけさせることができます。 scene.fog = new THREE.FogExp2( 0xAA9966, 0.015
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://github.com/mrdoob/three.js/blob/master/examples/webgl_loader_ply.html
GitHub - josdirksen/learning-threejs: Code repository for the examples from the Packt book "Learning Threejs"