Away3Dはオープンソースのリアルタイム3Dエンジンだ。もともとはFlashプラットフォーム向けに開発された。そのAway3Dエンジンが
その初めてのお題は,
サンプル1 Away3D 14/
- ※1
- Away3D TypeScriptのライブラリには,
バージョンおよびビルド番号がはっきりと書かれていない。そのため, サンプルのタイトルには, 使ったビルドの日本時間日付を添えている。本稿執筆時の最新ビルドは2014年8月26日付だ (後掲図2参照)。
Away3D TypeScriptライブラリを使う
まずは,
サンプルコードなどAway3D TypeScriptを試してみるには,
HTMLドキュメントには,
<script src="lib/awayjs-core.next.min.js"></script>
<script src="lib/stagegl-core.next.min.js"></script>
<script src="lib/stagegl-extensions.next.min.js"></script>
<script>
function initialize() {
// 初期設定
}
</script>
<body onload="initialize();">
Away3Dの3次元表現で用意しなければならないのは,
- Away3Dで用意しなければならないもの
- 舞台:Viewオブジェクトで3次元空間の表示領域を定める
- 照明:光源のオブジェクトで3次元空間を照らす
- 役者:物体のひながたからインスタンスをつくって3次元空間に加える
Viewクラスで3次元空間の表示領域を定める
第1につくらなければならないのは,
new away.containers.View(new away.render.DefaultRenderer())
Viewオブジェクトには,
表1 Viewクラスに備わる基本的なプロパティ
Viewクラスのプロパティ | プロパティの値 |
---|---|
width height | 表示される領域の幅と高さ。 |
backgroundColor | 画面の背景色。デフォルト値は黒 |
camera | 表示領域を描くために用いられるCamera3Dオブジェクト。 |
scene | 表示領域を描くもととなる3次元空間のSceneオブジェクト。 |
Viewオブジェクトをつくって返す関数
createView(幅, 高さ, 背景色)
関数
var view;
function initialize() {
view = createView(240, 180, 0x0);
}
function createView(width, height, backgroundColor) {
var defaultRenderer = new away.render.DefaultRenderer();
var view = new away.containers.View(defaultRenderer);
view.width = width;
view.height = height;
view.backgroundColor = backgroundColor;
return view;
}