webgl - 如何检测网格上亮面的数量?

标签 webgl three.js

我在 THREE.scene 中排列了许多对象,我想计算或检索一个相对值,该值指示每个对象从单个 PointLight 源接收的光量。简化示例:

将光定位在相机上时,由于 6 个面中有 3 个完全暴露,因此 Block 1 的值可能为 0.50,而 2 为 ~0.33, 3 为 ~1.67。

我可能可以通过从光线向每个面的中心绘制一条光线并查看相交来实现这一点,但我假设可以直接检索每个面的亮度级别。

最佳答案

此代码考虑了对象的全局矩阵。

var amount = 0;

var rotationMatrix = new THREE.Matrix4();
var vector = new THREE.Vector3();
var centroid = new THREE.Vector3();
var normal = new THREE.Vector3();

for ( var i = 0; i < objects.length; i ++ ) {

    var object = objects[ i ];

    rotationMatrix.extractRotation( object.matrixWorld );

    for ( var j = 0; j < object.geometry.faces.length; j ++ ) {

        var face = object.geometry.faces[ j ];

        centroid.copy( face.centroid );
        object.matrixWorld.multiplyVector3( centroid );

        normal.copy( face.normal );
        rotationMatrix.multiplyVector3( normal );

        vector.sub( light.position, centroid ).normalize();

        if ( normal.dot( vector ) > 0 ) amount ++;

    }

}

关于webgl - 如何检测网格上亮面的数量?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10725501/

相关文章:

javascript - 加速 THREE.js 的方法

three.js - 如何使用 THREE.js 围绕行星旋转一些卫星?

javascript - 如果在调试器中没有断点,this.el.object3D.position.set(0,0,0) 不起作用

javascript - 在 THREE.js 中在两个轴上旋转 3d 矢量

javascript - 为什么我的场景没有渲染?

java - Three.js:如何将场景转换为 MPG4 视频?

javascript - 如何包含 gl-matrix?

javascript - WebGL 纹理 : second time load sizing is wrong

javascript - 在 WebGL 着色器中使用 UInt8Array 数据

javascript - 如何对 WebGL 着色器进行基准测试?