How to create a cube

Note: Please refer to the Hello Cube demo to see this code at work.

Here's a complete code listing to make a red rotating cube animation with J3D. Place this code inside a <script> tag in your documents

section:

var engine, cube, light;

window.onload = function() {
	
	if(!checkWebGL()) return;
	
	engine = new J3D.Engine();	
	engine.setClearColor(J3D.Color.white);
	engine.scene.ambient = new J3D.Color(.5, .5, .5, 1);
	
	light = new J3D.Transform();
	light.light = new J3D.Light(J3D.DIRECT);
	light.light.color = new J3D.Color(.5, .5, .5, 1);
	light.light.direction = new v3(1, 0, 1).norm();
	
	cube = new J3D.Transform();
	cube.geometry = J3D.Primitive.Cube(1, 1, 1);		
	cube.renderer = new J3D.Phong();
	cube.renderer.color = new J3D.Color(1,0,0,1);
	
	engine.camera = new J3D.Camera();
	engine.camera.transform.position.z = 4;

	engine.scene.add(engine.camera.transform, cube, light);
	draw();
}

function draw() {
	requestAnimationFrame(draw);
	cube.rotation.x += Math.PI * J3D.Time.deltaTime / 6000;
	cube.rotation.y += Math.PI/2 * J3D.Time.deltaTime / 3000;
	engine.render();
}

Back to wiki Home page.