相关疑难解决方法(0)

我正在尝试将文件中的场景加载到Three.js(自定义格式,而不是Three.js支持的格式).该特定格式描述了场景图,其中树中的每个节点具有指定为4×4矩阵的变换.将它推入Three.js的过程看起来像这样:

// Yeah, this is javascript-like psuedocode
function processNodes(srcNode, parentThreeObj) {
    for(child in srcNode.children) {
        var threeObj = new THREE.Object3D();

        // This line is the problem
        threeObj.applyMatrix(threeMatrixFromSrcMatrix(child.matrix));

        for(mesh in child.meshes) {
            var threeMesh = threeMeshFromSrcMesh(mesh);
            threeObj.add(threeMesh);
        }

        parentThreeObj.add(threeObj);

        processNodes(child, threeObj); // And recurse!
    }
}

或者至少那是我想要的.正如我所指出的那样,这applyMatrix条线路并不像我期望的那样工作.场景的大部分看起来都不错,但是已经旋转的某些元素没有正确对齐(而其他元素则很奇怪).

通过COLLADA加载器(我的工作大致相同),它们似乎将矩阵分解为平移/旋转/缩放并单独应用.我尝试用它代替上面显示的applyMatrix:

var props = threeMatrixFromSrcMatrix(child.matrix).decompose();
threeObj.useQuaternion = true;
threeObj.position = props[ 0 ];
threeObj.quaternion = props[ 1 ];
threeObj.scale = props[ 2 ];

这再一次产生了一个场景,其中大多数元素都在正确的位置,但之前未对齐的网格现在已经转变为遗忘在某处并且根本不再出现.所以最后这并不比applyMatrix上面的更好.

通过几个关于该主题的在线讨论,似乎为变换使用矩阵的推荐方法是将它们直接应用于几何,而不是节点,所以我尝试通过手动构建变换矩阵,如下所示:

function processNodes(srcNode, parentThreeObj, …

我试图在一个简单的three.js场景中手动设置相机的矩阵.我已经尝试将matrix.set方法与matrixAutoUpdate = false一起调用,但是在场景渲染的同时,它不会像我希望的那样随时间变化.我也尝试用camera.matrix =设置矩阵,结果相同.让我觉得我错过了一些关于如何让对象"接受"手动设置值的东西.我也尝试过applyMatrix,但这似乎完全做了别的事情.

任何建议非常感谢 - 谢谢!

这是代码中的一支代码:

http://codepen.io/heyscam/pen/phflL

这里只是JS:

var WIDTH = 640;
var HEIGHT = 360;

var VIEW_ANGLE = 31.417;
var ASPECT = WIDTH / HEIGHT;
var NEAR = 0.1;
var FAR = 10000;

var $container = $('#container');
console.log($container);

var renderer = new THREE.WebGLRenderer();
renderer.setSize(WIDTH, HEIGHT);
$container.append(renderer.domElement);

var scene = new THREE.Scene();

var camera = new THREE.PerspectiveCamera(
  VIEW_ANGLE,
  ASPECT,
  NEAR,
  FAR
);
scene.add(camera);

var cube = new THREE.Mesh(
  new THREE.CubeGeometry(200, 200, 200)
);
scene.add(cube);

var frame = 0; …