La première personne de la simulation avec three.js en utilisant les flèches du clavier

Pour ma source, visitez http://jsfiddle.net/fYtwf/

Fond

J'ai une simple simulation en 3d à l'aide de three.js lorsque l'appareil photo est entouré en 3 dimensions par les cubes. Ces cubes sont pour aider à visualiser l'endroit où la caméra est à la recherche jusqu'à ce que le point de vue des contrôles sont codé et testé. Je veux créer une simple application 3D, où la caméra est contrôlée via jusqu', bas, gauche et droit clés. Tout comme le déménagement de votre tête

Questions

Dans mon application actuelle, en regardant vers l'avant, et de commencer à regarder vers le haut, nous avons du succès. Toutefois, lorsque nous tournons à gauche de 90 degrés, et nous appuyer sur la flèche vers le haut... Le mal de chose arrive. l'appareil photo incrémente l'axe des x, mais parce que nous sommes face à une autre direction, la modification de l'axe des x est SEUL TORT...

Maintenant, je suppose que c'est parce que certains de la trigonométrie est nécessaire pour calculer les valeurs correctes pour l'axe z. Cependant, mon trig n'est pas génial.

Actuel

Pour obtenir une meilleure compréhension de ce que je veux dire, merci de visiter mon jsfiddle : http://jsfiddle.net/fYtwf/

JUSQU' touche incrémente X

BAS clé décrémente X

GAUCHE touche incrémente Y

DROIT clé décrémente Y

Q touche incrémente Z

W clé décrémente Z

( Q et W ont été codés seulement pour essayer de m'aider à comprendre. )

À partir de ma compréhension actuelle, lorsque j'appuie sur la touche HAUT, X doit d'incrémentation et de l'axe Z doit être modifiés en fonction de l'axe des Y est. Cependant, je ne connais pas l'algorithme 🙁

Donc X et Z doivent être modifiées dans le KEYUP code ( je pense, corrigez-moi si je me trompe )

//setRotateX, getRotateX, setRotateY and getRotateY are extended
//camera functions I wrote so I could work with degrees. Solution
//IS NOT required to use them, they just helped me

switch( key )
{
    case KEYUP:
        if ( camera.getRotateX() < 90 ){ //restrict so they cannot look overhead
            camera.setRotateX( camera.getRotateX() + VIEW_INCREMENT );
        }
        break;

    case KEYDOWN:
        if ( camera.getRotateX() > -90 ){ //restrict so they cannot look under feet
            camera.setRotateX( camera.getRotateX() - VIEW_INCREMENT );
        }
        break;

    case KEYLEFT:
        camera.setRotateY( camera.getRotateY() + VIEW_INCREMENT );
        break;

    case KEYRIGHT:
        camera.setRotateY( camera.getRotateY() - VIEW_INCREMENT );
        break;
}

OriginalL'auteur AlexMorley-Finch | 2012-11-06