Away3D TypeScriptで静的なオブジェクトが表示されない [Edit]

A static object of Away3D TypeScript is not displayed

Away3D TypeScriptで3次元空間に加えた静的なDisplayObjectインスタンスは、View.render()メソッドを呼出しても表示されないことがあります。

A static DisplayObject instance added into the 3 dimensional space of the Away3D TypeScript might not be displayed in spite of calling the View.render() method.

以下のコード001は、Away3Dの3次元空間に立方体をつくって、View.render()で描画します(コードの解説については「Away3D: 立方体を回してみる」参照)。ところが、立方体は表示されません。

The code 001 below create a cube in the 3 dimensional space of the Away3D and render it with the View.render() method. However the cube is not displayed in the space.

コード001■Away3Dで3次元空間に立方体をつくる
var view;
var mesh;
function initialize() {
	var directionalLight = createDirectionalLight(0.25, 0x00FFFF);
	view = createView(240, 180, 0x0);
	mesh = createCube(400, 400, 400, directionalLight);
	view.scene.addChild(mesh);
	mesh.rotationX = -30;
	mesh.rotationY = 30;
	view.render();
	// view.render();
}
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;
}
function createCube(width, height, depth, light) {
	var defaultTexture = away.materials.DefaultMaterialManager.getDefaultTexture();
	var material = new away.materials.TriangleMethodMaterial(defaultTexture);
	var mesh = new away.prefabs.PrimitiveCubePrefab(width, height, depth, 1, 1, 1, false).getNewObject();
	mesh.material = material;
	material.lightPicker = new away.materials.StaticLightPicker([light]);
	return mesh;
}
function createDirectionalLight(ambient, color) {
	var light = new away.entities.DirectionalLight();
	light.direction = new away.geom.Vector3D(0, -1, 1);
	light.ambient = ambient;
	light.color = color;
	return light;
}
Code 001•Creating a cube in the 3 dimensional space of the Away3D

そこで、RequestAnimationFrameクラスを用いて、立方体を回してみます。すると、立方体は表示されて、回転するアニメーションになります(サンプル001)。

Then, try to rotate the cube with the RequestAnimationFrame class. Now, the cube will be displayed and will rotate as animation(Example 001).

サンプル001■Away3Dで3次元空間につくった立方体を回す
Example 001•Rotating a cube created in the 3 dimensional space of the Away3D

結果としては、View.render()メソッドを少なくとも2回呼ばないと、オブジェクトは描画されないようです。前掲コード001にこの修正を加えて、つぎのサンプル002として掲げました。

As the conclusion, the View.render() method has to be called at least twice to render an object in the space. The revised code 001 is attached as the example 002 below.

サンプル002■Away3D 14/08/18 : Rendering a static cube in the 3D space
Example 002•Away3D 14/08/18 : Rendering a static cube in the 3D space

その他の記事