Three.js - 剪裁平面和齐次坐标

时间:2017-06-20 05:35:29

标签: three.js

我想更好地理解使用w齐次坐标转换的对象如何与剪裁平面相互作用。

我在下面的plunkr中有一个简单的效果示例。更大的球体已被缩放"在其矩阵中使用w分量,并且裁剪平面不再与变换对象的行为与原始对象的行为相同。

http://embed.plnkr.co/byuOjY4oWIx2QDrg5CV0/

我意识到这不是一般缩放对象的正确方法,但我有兴趣获得可能有助于我将剪裁平面应用于此类对象的观察结果。

以下是相关代码:

  function drawSphere() {
  var leftClipPlane = new THREE.Plane(new THREE.Vector3(-1, 0, 0), 0);
  var sphereMaterial = new THREE.MeshPhongMaterial({
    shininess: 100,
    transparent: true,
    opacity: 0.5,
    combine: THREE.MixOperation,
    reflectivity: 0.3,
    side: THREE.DoubleSide,
    clippingPlanes: [leftClipPlane]
  });
  sphereMaterial.color.setRGB(0.4, 0, 0.4);

  sphereObj = new THREE.Object3D();

  sphere = new THREE.Mesh(new THREE.SphereGeometry(SPHERE_SIZE, 16, 16),
    sphereMaterial);
  sphere.name = 'sphere';
  sphereObj.add(sphere);
  scene.add(sphereObj);

  var otherSphereObj = new THREE.Object3D();
  otherSphereObj.copy(sphereObj.clone(), true);
  otherSphereObj.matrixAutoUpdate = false;
  var transformMatrix = new THREE.Matrix4();

  transformMatrix.set(
    1, 0, 0, 0,
    0, 1, 0, 0,
    0, 0, 1, 0,
    0, 0, 0, 0.5
  );

  otherSphereObj.matrix.multiply(transformMatrix);
  scene.add(otherSphereObj);
}

0 个答案:

没有答案