Многократное вращение камеры - PullRequest
Новая
       19

Многократное вращение камеры

0 голосов
/ 11 ноября 2011

Я пытаюсь сделать несколько простых вращений камеры в приложении WebGL (используя урок 10 из Learning WebGL ), но я определенно делаю что-то не так ... Я имею в виду горизонтальное движение камеры кажется хорошим Движение с помощью WASD также выглядит нормально, но когда я добавляю вертикальное движение, в некоторых точках карты что-то идет не так, и карта начинает наклоняться. Где моя ошибка? (демоверсия здесь )

что я делаю это: 

function handleMouseMove(event) {
    var canvas = document.getElementById("quak-canvas"); 
    var newX = event.clientX;
    var newY = event.clientY;

    var newRotationMatrix = mat4.create();
    mat4.identity(newRotationMatrix);

    var deltaY = newY - lastMouseY;
    mat4.rotate(newRotationMatrix, degToRad(deltaY / 40), [1, 0, 0]);

    var deltaX = newX - lastMouseX;
    horizontalAngle = (event.pageX/(canvas.width/2))*180;
    mat4.rotate(newRotationMatrix, degToRad(deltaX / 3.75), [0, 1, 0]);

    mat4.multiply(newRotationMatrix, moonRotationMatrix, moonRotationMatrix);

    lastMouseX = newX
    lastMouseY = newY;

    window.moveBy(10, 10);
}

Я думаю, что какой-то перевод отсутствует или что-то в этом роде, но я пробовал некоторые комбинации, но они не увенчались успехом ..

Большое спасибо
Serhiy.

1 Ответ

1 голос
/ 11 ноября 2011

Прежде всего, позвольте мне сказать, что вы демо на самом деле выглядит хорошо для меня.Может быть, это побочный эффект затухающего вертикального вращения, но я не вижу ничего, что выглядит слишком ужасно.Ваш код выглядит нормально тоже по большей части.Я думаю, что ядром вашей проблемы может быть умножение матрицы в конце.Тот факт, что вы всегда строите результаты предыдущего кадра, может привести к некоторым сложностям.

В моем коде движения FPS я пересчитываю матрицу вида для каждого кадра следующим образом: 

 var viewMat = mat4.create();
 mat4.identity(viewMat);
 mat4.rotateX(viewMat, xAngle); // X angle comes from Y mouse movement
 mat4.rotateY(viewMat, yAngle); // Y angle comes from X mouse movement
 mat4.translate(viewMat, position);

Положение рассчитывается при нажатии WASD следующим образом: 

var dir = vec3.create();
if (pressedKeys['W']) { dir[2] -= speed; }
if (pressedKeys['S']) { dir[2] += speed; }
if (pressedKeys['A']) { dir[0] -= speed; }
if (pressedKeys['D']) { dir[0] += speed; }
if (pressedKeys[32]) { dir[1] += speed; } // Space, moves up
if (pressedKeys[17]) { dir[1] -= speed; } // Ctrl, moves down

// Create an inverted rotation matrix to transform the direction of movement by
var cam = mat4.create();
mat4.identity(cam);
mat4.rotateY(cam, -yAngle);
mat4.rotateX(cam, -xAngle);

// Move the camera in the direction we are facing
mat4.multiplyVec3(cam, dir); 
vec3.add(position, dir);

Надеюсь, это поможет вам получить рабочее решение для вашего собственного кода!

...