Здравствуйте! как разукрасить шахматную доску Three.js
и когда я добавляю анимацию с экрана все пропадает
var render = function () {
requestAnimationFrame( render );
if (cube001)
{
Cube001.rotation.x += 0.1;
}
renderer.render(scene, camera);
};
render();
а,
а это полностью 
<html>
<head>
<title>My first Three.js app</title>
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="js/OrbitControls.js"></script>
<script src="library/three.js"></script>
<script>
const scene = new THREE.Scene();
const fov = 75;
const aspect = 1; // the canvas default
const near = 1;
const far = 100;
const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
camera.position.set(8, 3, 20);
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxGeometry( 1, 0.2, 1 );
const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
for (var i = 0; i <= 5; i++)
{
for (var j = 0; j <= 5; j++)
{
const cube = new THREE.Mesh( geometry, material );
cube.position.set(i*2,0,j*-2);
if (i==1 && j==1)
{
cube.name='cube001'; alert(cube.name);
}
if (i==1 && j==2)
{
cube.name='cube002'; alert(cube.name);
}
scene.add(cube);
}
}
/////////////
//camera.position.set(0,0,5);
var render = function () {
requestAnimationFrame( render );
if (cube001)
{
Cube001.rotation.x += 0.1;
}
renderer.render(scene, camera);
};
render();
//sound
// create an AudioListener and add it to the camera
const listener = new THREE.AudioListener();
camera.add( listener );
// create a global audio source
const sound = new THREE.Audio( listener );
// load a sound and set it as the Audio object's buffer
const audioLoader = new THREE.AudioLoader();
audioLoader.load( 'sound/sound_3.ogg', function( buffer ) {
sound.setBuffer( buffer );
sound.setLoop( true );
sound.setVolume( 0.5 );
sound.play();
});
//sound_FIN
</script>
</body>
</html>
