用Three.js和cannon.js创建一个房间

Question

我刚刚开始使用Three.js和cannon.js，我一直试图创建一个简单的房间，但没有成功。我正在这个例子工作，我一直在努力增加墙壁和天花板。做这件事最简单的方法是什么？现在我有

                // wall?
            wallGeometry = new THREE.PlaneGeometry( 300, 300 );
            wallGeometry.applyMatrix( new THREE.Matrix4().makeRotationX( Math.PI));
            wallMesh = new THREE.Mesh( wallGeometry, material );
            wallMesh.castShadow = false;
            wallMesh.receiveShadow = true;
            scene.add(wallMesh);

但这很奇怪而且我不会撞到它..。如果我试图通过cannon.js添加它，我会得到一堵看不见的墙，但看不见它。谁能给我指明正确的方向吗？

Answer 1

THREE.js本身没有物理成分，所以当你在它里面创建任何物体时，它永远不会让你自己“撞”它们。您必须自己编写这样的特性，或者为此使用另一个库(因为您已经在尝试使用cannon.js)。

下一步-默认情况下，三个js将只为您的场景创建一个环境光。如果您想要动态闪电和阴影，所有的灯光都必须由您提供，并且您想要对灯光作出反应的对象必须使用MeshLambertMaterial或MeshPhongMaterial，对于阴影，您必须设置两个属性并使用特定类型的灯光。

在你的例子中，你似乎没有定义任何地方的墙壁材料--这可能就是为什么墙壁是看不见的。

检查这些代码并窃取您需要的代码片段(看起来您需要大量代码:-)

http://threejs.org/examples/

http://stemkoski.github.io/Three.js/index.html