如何在不设置 z 坐标的情况下为 Three.js 对象提供 z 索引? [英] How to give Three.js objects a z-index without setting their z-coordinate?

问题描述

我正在使用 Three.js 来渲染多个分层排列的 2D 对象 (THREE.PlaneGeometry).所有这些都应该在同一个平面上对齐，但有些物体在"其他物体的前面"或挡住了"其他物体的视线.换句话说，我想模拟 CSS z-index 属性，但没有实际使用 z-dimension，因为这会导致透视问题.

I'm using Three.js to render a number of 2D objects (THREE.PlaneGeometry) arranged in layers. All of them should be aligned on the same flat plane, but with some objects "in front of" or "blocking the view of" others. In other words, I want to simulate the CSS z-index property, but without actually using the z-dimension, because that would cause perspective issues.

Three.js 有这方面的功能吗?

Does Three.js have a facility for this?

推荐答案

你需要使用polygonOffset (http://threejs.org/docs/api/materials/Material.html)

You need to use polygonOffset (http://threejs.org/docs/api/materials/Material.html)

这篇关于如何在不设置 z 坐标的情况下为 Three.js 对象提供 z 索引?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！