Question

我正在开发类似Maya的相机实现，并且我已经正确地完成了跟踪和移动功能但是我无法实现翻滚。

我在PhiloGL引擎（WebGL基础）工作，所以我非常感谢这个引擎中的代码帮助。

我看过Maya的相机实际上是如何工作的，但我找不到。这是我的代码到目前为止

if(mode == "rot")
    {                           
      var angleX = diffx / 150;
      var angleY = diffy / 150;
      //var angleZ = sign * Math.sqrt((diffx * diffx)+(diffy * diffy)) / 150;

      e.stop(); 

      //axe Z
      //camera.position.x = x * Math.cos(angleX) - y * Math.sin(angleX);       
      //camera.position.y = x * Math.sin(angleX) + y * Math.cos(angleX);                    

      //axe X   
      //camera.position.y = y * Math.cos(angleY) - z * Math.sin(angleY);
      //camera.position.z = y * Math.sin(angleY) + z * Math.cos(angleY);   

      //camera.update();                                                                                                 

      //axe Y                                   
      camera.position.z = z * Math.cos(angleX) - x * Math.sin(angleX);
      camera.position.x = z * Math.sin(angleX) + x * Math.cos(angleX);                                                                                                                          

      camera.update();                                                         

      position.x = e.x;
      position.y = e.y;
      position.z = e.z;  
    }

这不起作用，我也不知道我做错了什么。

任何线索？

Answer 1

我在inka3d（www.inka3d.com）中使用它，但它不依赖于inka3d。输出是4x4矩阵。你能利用它吗？

// turntable like camera, y is up-vector
// tx, ty and tz are camera target position
// rx, ry and rz are camera rotation angles (rad)
// di is camera distance from target
// fr is an array where the resulting view matrix is written into (16 values, row major)
control.cameraY = function(tx, ty, tz, rx, ry, rz, di, fr)
{
    var a = rx * 0.5;
    var b = ry * 0.5;
    var c = rz * 0.5;
    var d = Math.cos(a);
    var e = Math.sin(a);
    var f = Math.cos(b);
    var g = Math.sin(b);
    var h = Math.cos(c);
    var i = Math.sin(c);
    var j = f * e * h + g * d * i;
    var k = f * -e * i + g * d * h;
    var l = f * d * i - g * e * h;
    var m = f * d * h - g * -e * i;
    var n = j * j;
    var o = k * k;
    var p = l * l;
    var q = m * m;
    var r = j * k;
    var s = k * l;
    var t = j * l;
    var u = m * j;
    var v = m * k;
    var w = m * l;
    var x = q + n - o - p;
    var y = (r + w) * 2.0;
    var z = (t - v) * 2.0;
    var A = (r - w) * 2.0;
    var B = q - n + o - p;
    var C = (s + u) * 2.0;
    var D = (t + v) * 2.0;
    var E = (s - u) * 2.0;
    var F = q - n - o + p;
    var G = di;
    var H = -(tx + D * G);
    var I = -(ty + E * G);
    var J = -(tz + F * G);
    fr[0] = x;
    fr[1] = A;
    fr[2] = D;
    fr[3] = 0.0;
    fr[4] = y;
    fr[5] = B;
    fr[6] = E;
    fr[7] = 0.0;
    fr[8] = z;
    fr[9] = C;
    fr[10] = F;
    fr[11] = 0.0;
    fr[12] = x * H + y * I + z * J;
    fr[13] = A * H + B * I + C * J;
    fr[14] = D * H + E * I + F * J;
    fr[15] = 1.0; 
};

Maya式摄像头实现

1 个答案: