threejs webgl坐标轴缩放为负值会影响正反面吗?

随便找了一张uv图片
1.png
如下我创建了一个三角形,三个顶点以及对应的uv坐标

    let geometry = new THREE.BufferGeometry();
    geometry.setAttribute(
      "position",
      new THREE.BufferAttribute(
        new Float32Array([-1.0, 1.0, 0, -1.0, -1.0, 0, 1.0, 1.0, 0]),
        3
      )
    );
    geometry.setAttribute(
      "uv",
      new THREE.BufferAttribute(new Float32Array([0.0, 1.0, 0, 0, 1.0, 1.0]), 2)
    );

    let mesh = new THREE.Mesh(
      geometry,
      new THREE.MeshBasicMaterial({
        map: new THREE.TextureLoader().load("/1.png"),
      })
    );

如下图顶点顺序是逆时针所以从屏幕射向我们这面是正面,这没问题。
image.png
当我克隆一份然后进行x轴缩放-1

    let clonedMesh = mesh.clone(true);
    scene.add(mesh);
    clonedMesh.scale.set(-1, 1, 1);
    clonedMesh.position.x = 2;
    scene.add(clonedMesh);

顺序如下变成顺时针了,那正面应该是射向屏幕里面,而MeshBasicMaterial默认是只渲染正面,那按理说clonedMesh应该是看不到才对。

image.png

阅读 1.3k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题