二次方程式行进立方体 - Three.js

Question

我试图实现一个显示不同类型 space quadrics 的小程序，使用 three.js 的 Marching Cubes 库来渲染隐式表面。虽然出现的形状不正确，我想我没有根据需要实现 THREE.MarchingCubes 的属性。小程序的核心有如下代码

        quadricData = {
            a11: 1,
            a22: 1,
            a33: 1,
            a12: 0,
            a13: 0,
            a23: 0,
            a1: 0,
            a2: 0,
            a3: 0,
            a: -1
        };

        quadValue = function (data, x, y, z) {
            return data.a11*x*x+
                   data.a22*y*y+
                   data.a33*z*z+
                   data.a12*2*x*y+
                   data.a13*2*x*z+
                   data.a23*2*y*z+
                   data.a1*x+
                   data.a2*y+
                   data.a3*z+
                   data.a;
        }

        var res = 50;
        var material = new THREE.MeshPhongMaterial( {
            color: '#1565C0', // blue 800
            transparent: true,
            opacity: 0.8,
            side: THREE.DoubleSide,
            flatShading: true
        } );

        quadric = new THREE.MarchingCubes( res, material );
        quadric.isolation = 0;

        for ( var k = 0 ; k < res ; k++ ) {
            for ( var j = 0 ; j < res ; j++ ) {
                for ( var i = 0 ; i < res ; i++ ) {

                var x = 8*(i-res/2)/res;
                var y = 8*(j-res/2)/res;
                var z = 8*(k-res/2)/res;

                quadric.field[ i + j*res + k*res*res ] = quadValue(quadricData,x,y,z);

                }
            }
        }

但可以检查完整代码 here。我想 field 属性必须用函数的值填充，但也许这不是正确的处理方法。奇怪的效果出现了，例如，当 a11 变大时，椭圆体会扩大而不是缩小； 'marching cubes grid' 似乎也在扩大，这有点有趣。

许多其他配置与预期结果不符。 THREE.MarchingCubes 的正确使用方法是什么？

Answer 1

使用THREE.MarchingCubes:

通过 <script src="https://threejs.org/examples/js/MarchingCubes.js"></script>
分配分辨率为 R 的体积，这将是一个分辨率为 R x R x R 的体素立方体，通过 V = new THREE.MarchingCubes( R, material )
填写体素值，这是一个浮点值的线性数组。位置 [X,Y,Z] 处的体素索引为 (X + (Y * R) + ( Z * R * R))。通过 V.field[ i + j*R + k*R*R ] = f
设置isolation值。显示的体积将是所有小于该值的体素，所以这都可以称为等值面值。通过 V.isolation = s.

您的代码似乎工作正常。增加 a11 确实会按预期减少 x 维度的体积。

我唯一注意到的是代码将a12和a13和a23乘以2。如果二次方程表示为：

Ax^2 + By^2 + Cz^2 + Dxy + Exz + Fyz + Gz + Hy + Iz + J = 0

而计算是：data.a11*x*x + data.a22*y*y + data.a33*z*z + data.a12*2*x*y + data.a13*2*x*z + data.a23*2*y*z + data.a1*x + data.a2*y + data.a3*z + data.a，那么好像无缘无故把D E和F乘以2了？

否则，您是否在发布问题后解决了错误？或者您能否更具体地说明问题？

错误报告： 有一个 bug report 14060 logged against three.js here。截至 2018 年 5 月，three.js 版本 r92，Marching Cubes 库似乎在 (1) Windows 和 MacOS 中的 Firefox，(2) MacOS 上的 Safari 中工作。它在 Linux 上的 Firefox 和任何系统上的 Chrome 中都出现错误。关闭平面着色可能会解决问题。

二次方程式行进立方体 - Three.js

Marching Cubes for Quadrics - Three.js

javascript

3d

marching-cubes

three.js