我在函数中构建了一个框,将其值分配给名为box
的变量,然后尝试通过按“ w”来设置节点的颜色,调用框变量并将其定义为另一个任意变量
<html>
<head>
<title>My first three.js app</title>
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="js/three.js"></script>
<script>
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75,
window.innerWidth/window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
camera.position.z = 5;
renderer.render( scene, camera );
var box= function() {
this.root = new THREE.Object3D;
}
box.prototype.buildBox = function(){
var geometry = new THREE.BoxGeometry( 0.2, 0.3, 0.1 );
var material = new THREE.MeshLambertMaterial( {
color: "white", // CSS color names can be used!
} );
var a= new THREE.Mesh( geometry, material );
this.root.add(a);
return this.root;
};
this.scene.add(this.buildBox());
document.addEventListener("keydown", onDocumentKeyDown, false);
function onDocumentKeyDown(event) {
var keyCode = event.which;
this.Box = new box();
var b = this.Box.buildBox();
var keyCode = event.which;
if (keyCode == 87) {
b.material.color.setHex (0xfff00);
}
render();
</script>