Wie dreh ich Würfel auf Knopf klicken in three.js?

Question

hier ist mein code ... cube ist ein perfektes aber ich möchte auf Knopfdruck drehen.
eg..when i Fronttaste klicken dann Würfel Vorderseite gleiche wie andere Taste
Ich habe eine Menge Forschung zeigen, aber ich jemand kann mir helfen .. jede Lösung
bitte

nicht gefunden

var scene, camera, renderer, cube; 
 
    
 
    init(); 
 
    //drag(); 
 
    
 
    function init() { 
 
    
 
     // renderer 
 
     var container = document.getElementById("container"); 
 
     renderer = new THREE.WebGLRenderer({ antialias: true }); 
 
     renderer.setSize(window.innerWidth, window.innerHeight); 
 
     renderer.setClearColor ('#fff', 1); 
 
     container.appendChild(renderer.domElement); 
 
    
 
    
 
     // camera 
 
     camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 1000); 
 
    \t camera.position.x = 50; 
 
    \t camera.position.y = 50; 
 
    \t camera.position.z = 800; 
 
    
 
     //cube 
 
     var geometry = new THREE.BoxBufferGeometry(250, 350, 100,1,1,1); 
 
    \t var cubeMaterial = new THREE.MeshLambertMaterial({color:"red"}); 
 
    
 
     cube = new THREE.Mesh(geometry, cubeMaterial); 
 
     //cube.doubleSided = true; 
 
    
 
     cube.rotation.x = Math.PI/1.5; 
 
     cube.rotation.y = Math.PI/1; 
 
     // scene 
 
     scene = new THREE.Scene(); 
 
     scene.add(cube); 
 
    
 
     // add subtle ambient lighting 
 
     var ambientLight = new THREE.AmbientLight(0x888888); 
 
     scene.add(ambientLight); 
 
    
 
     // directional lighting 
 
     var directionalLight = new THREE.DirectionalLight(0x666666); 
 
     directionalLight.position.set(1, 1, 1).normalize(); 
 
     scene.add(directionalLight); 
 
    
 
     
 
     function render() { 
 
      renderer.render(scene, camera); 
 
      //requestAnimFrame(render); 
 
      requestAnimationFrame(render); 
 
     } 
 
    
 
     render(); 
 
    }

body { 
 
margin: 0px; 
 
} 
 
#container { 
 
width: 100%; 
 
height: 100%; 
 
}

<script src="https://rawgit.com/mrdoob/three.js/r86/build/three.min.js"></script> 
 

 
<div id="container"></div>

Answer 1

Sie haben bereits Code, die eine gewisse Rotation tut:

cube.rotation.x = Math.PI/1.5; 
cube.rotation.y = Math.PI/1; 

Stellen Sie sich eine Reihe von Funktionen zusammen, die das Objekt in die gewünschten Winkel drehen und sie bei Tastenklicks aufrufen.