Math.radians = function(degrees) { return degrees * Math.PI / 180; }; var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 ); var renderer = new THREE.WebGLRenderer({ antialias:true}); renderer.setClearColor(new THREE.Color(0xEEEEEE, 1.0)); renderer.setSize( window.innerWidth, window.innerHeight ); renderer.shadowMapEnabled=true; renderer.shadowMapSoft=true; document.body.appendChild( renderer.domElement ); // Add floor var planeGeometry = new THREE.PlaneGeometry(350,350); var planeMaterial = new THREE.MeshLambertMaterial({color: 0xffffff}); var plane = new THREE.Mesh(planeGeometry,planeMaterial); plane.receiveShadow = true; plane.rotation.x=-0.5*Math.PI; plane.position.x=120 plane.position.y=0 plane.position.z=120 scene.add(plane); var light = new THREE.AmbientLight( 0x404040 ); // soft white light scene.add( light ); // Build hexas! var h = new Hexa(scene); h.build(); // Update position camera.position.x = -70; camera.position.z = 4; camera.position.y = 73; camera.lookAt(new THREE.Vector3(0,0,0)); var target = new THREE.Object3D(); target.position = new THREE.Vector3(5, 0, 0); var pointColor = "#ffffff"; var spotLight = new THREE.SpotLight(pointColor); spotLight.position.set(-79, 60, -10); spotLight.castShadow = true; spotLight.shadowCameraNear = 2; spotLight.shadowCameraFar = 200; spotLight.shadowCameraFov = 130; spotLight.target = plane; spotLight.distance = 0; scene.add(spotLight); var controls = new function () { this.position_x = spotLight.position.x; this.position_y = spotLight.position.y; this.position_z = spotLight.position.z; this.camera_x = camera.position.x; this.camera_y = camera.position.y; this.camera_z = camera.position.z; this.distance = spotLight.distance; } var gui = new dat.GUI(); gui.add(controls, 'position_x',-200,200).onChange(function (e) { spotLight.position.x = e; }); gui.add(controls, 'position_y',-200,200).onChange(function (e) { spotLight.position.y = e; }); gui.add(controls, 'position_z',-200,200).onChange(function (e) { spotLight.position.z = e; }); gui.add(controls, 'camera_x',-200,200).onChange(function (e) { camera.position.x = e; camera.lookAt(new THREE.Vector3(0,0,0)); }); gui.add(controls, 'camera_y',-200,200).onChange(function (e) { camera.position.y = e; camera.lookAt(new THREE.Vector3(0,0,0)); }); gui.add(controls, 'camera_z',-200,200).onChange(function (e) { camera.position.z = e; camera.lookAt(new THREE.Vector3(0,0,0)); }); document.addEventListener( 'mousemove', onDocumentMouseMove, false ); document.addEventListener( 'click', onDocumentMouseclick, false ); function onDocumentMouseclick( event ) { raycaster.setFromCamera( mouse, camera ); var intersects = raycaster.intersectObjects( scene.children, true ); if(intersects.length>0) { console.log('intersectObjects',intersects); for ( var i = 0; i < intersects.length; i++ ) { console.log('test ',intersects[ i ].object.material); if(intersects[ i ].object.material.materials) { intersects[ i ].object.material.materials[0].color.set(Math.random()* 0xffffff ); } } } } function onDocumentMouseMove( event ) { mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1; mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1; } var raycaster = new THREE.Raycaster(); var mouse = new THREE.Vector2(); function render() { requestAnimationFrame( render ); renderer.render( scene, camera ); } render();