javascript - BoxGeometry边

我已经在这里问了一个问题：Add Thickness to faces

核心问题已解决，但我遇到了另一个问题。
在我的墙壁设置在侧面：THREE.BackSide之前，这样它们在面对相机时不会显示出来，但是现在当它们的厚度不再起作用时，我真的不明白为什么。

之前：
Before

之后：After

我如何使厚壁的行为像平面墙？

最佳答案

控制墙的可见性的一个非常粗糙的概念（我稍微改变了几何的平移和定位）：

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set(0, 5, 5);
camera.lookAt(scene.position);
var renderer = new THREE.WebGLRenderer({
  antialias: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var controls = new THREE.OrbitControls(camera, renderer.domElement);

scene.add(new THREE.GridHelper(10, 10));

var points = [
  new THREE.Vector3(-2, 0, 2),
  new THREE.Vector3(2, 0, 2),
  new THREE.Vector3(2, 0, -2),
  new THREE.Vector3(-2, 0, -2)
]

var walls = [];

points.forEach((p, idx, points) => {
  let nextIdx = idx === points.length - 1 ? 0 : idx + 1;
  buildWall(p, points[nextIdx], 2, 0.1);

});

function buildWall(pointStart, pointEnd, height, thickness) {

  var boxW = pointEnd.clone().sub(pointStart).length();
  var boxH = height;
  var boxD = thickness;

  var boxGeometry = new THREE.BoxGeometry(boxW, boxH, boxD);
  boxGeometry.translate(0, boxH * 0.5, 0);
  boxGeometry.rotateY(-Math.PI * 0.5);
  var wall = new THREE.Mesh(boxGeometry, new THREE.MeshBasicMaterial({
    color: "aqua",
    wireframe: true
  }));
  wall.position.copy(pointStart).add(pointEnd).multiplyScalar(0.5);
  wall.lookAt(pointEnd);
  scene.add(wall);
  walls.push(wall);
}

var currentPosition = new THREE.Vector3();
render();

function render() {
  requestAnimationFrame(render);
  walls.forEach(w => {
    w.visible = currentPosition.copy(w.position).sub(camera.position).lengthSq() > camera.position.lengthSq();
  })
  renderer.render(scene, camera);
}

body {
  overflow: hidden;
  margin: 0;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/91/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>

关于javascript - BoxGeometry边，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50372250/