AS3.0 で 3D プログラミングを１から勉強する (5) - テクスチャを張る - てっく煮ブログ
as面を塗ることができたので、面に画像を貼り付けるのも簡単。画像を６つ用意して、立方体の上に貼り付けてみることにする。といっても前回までとほとんど変わらなくて、各頂点の 2D 上の座標を求めてから、画像を歪めて描画するだけでよい。問題は「どうやって画像を歪ませるか」という一点のみ。ActionScript 3 で画像を歪ませる方法ここからは完全に AS3 に限定したノウハウになる。答えは Graphics.beginBitmapFill() メソッドにある。 public function beginBitmapFill( bitmap:BitmapData, // 表示するビットマップ matrix:Matrix = null, // 変形方法を Matrix で指定 repeat:Boolean = true, // リピートするか smooth:Boolean = false //
AS3.0 で 3D プログラミングを１から勉強する (4) - 面に色を塗る - てっく煮ブログ
asワイヤーフレームにも飽きてきたので、色を塗ることにしよう。面に色を塗ることを、3D 用語ではシェーディングと呼ぶらしい。今回はその中でもシンプルなフラットシェーディングという技法を取り上げる。といっても、ActionScriptによるWebの3Dグラフィックス再入門 (2) - シェーディングでもっと3Dらしく：CodeZine で解説されてる通りにコーディングしているので、詳しいことはそちらの記事に譲ろう。コーディング結果はこうなった。だいぶ嬉しい感じ。これで終わるのもさすがに寂しいので、ソースの全体の流れを説明しておこう。奥の立方体から描画するために並べ替える立方体の面についても奥の面から描画するために並べ替える各面の法線ベクトルを求める面の明るさを求める面を描画するそれぞれについて簡単にみていく。1. 奥の立方体から描画するために並べ替える面を塗るにあたっては、塗る順番が重要にな
AS3.0 で 3D プログラミングを１から勉強する (3) - 透視投影 - てっく煮ブログ
as前回までのサンプルでは、遠くのものも近くのものも同じ大きさで表示していた。これでは立体感がでないので、遠くのものほど小さく表示するようにしたい。これを実現するには「投影」の方法を考えることになる。投影というのは、3D 上の点を 2D にマッピングすることを指す。今までは、Zの値を無視する方法を利用していたが、この手法には平行投影という名前がついている。それに対して、今回紹介するのが透視投影だ。遠くのものほど小さく表示できるので、遠近感を表現できる投影方法となっている。透視投影ってなあに？透視投影では「焦点」と「スクリーン」という概念が登場する。焦点は自分の目を表し、スクリーンは 3D の空間を投影する面である、と考えると分かりやすいだろう。スクリーンを窓として考えると、もっとすっきりするかもしれない。貴方は窓から外の景色をみている。窓の外の景色を、窓の上に見えた通りに描いていったとしよ
AS3.0 で 3D プログラミングを１から勉強する (2) - 行列の導入 - てっく煮ブログ
asこのまま実装を進めていくとソースが複雑になりそうなので少し地盤を固めておこう。座標計算を簡潔にするために行列クラスを導入する。Matrix3D クラス前回は軸の周りの回転を公式 p.x = Math.cos(rad) * x + Math.sin(rad) * y; p.y = -Math.sin(rad) * x + Math.cos(rad) * y; を使って直接計算していたけど、ここを行列に置き換えてみる。ちょうど、3D ライブラリ FIVe3D 2.1 に Matrix3D クラスがあったのでこれを借用した。X軸周りに rad ラジアン回転する演算は次のように書けるようになる。 // 回転前の点 p1 を定義 var p1:Point3D = new Point3D(0, 10, 20); // rad ラジアン回転する行列を作成 var matrix:Matrix3D =
AS3.0 で 3D プログラミングを１から勉強する (1) - てっく煮ブログ
as3D の原理をあまり知らなかったので、ActionScript 3.0 で１から勉強してみた。１からなのでフレームワークは使わず、自力で実装していく。Web 上には色んな資料があってありがたいだけど、玉石混交な上に、有用なものでも一本道で幅の狭いものが多い。前提知識のない自分にとっては、資料間の関連性を理解するのが大変だった。なので、なるべく簡単なところからスタートしつつ、広く浅く体験していくことを目標としてみる。まずは、四面体をワイヤーフレームで表示するところからスタートしよう。四面体を定義するまずは、3次元上の点を表現する Point3D クラスを作る。 class Point3D { public var x:Number; public var y:Number; public var z:Number; public function Point3D(_x:Number =
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
