Three.js雕刻网格

时间:2019-06-13 07:09:15

标签: three.js

我要实时雕刻戒指服务。因此,我想在Three.js中雕刻戒指。

我在gltf文件中插入了一个环。然后我尝试了ThreeCSG.js,错误是not convex!

这是示例代码。

var ring, temp;

THREE.DRACOLoader.setDecoderPath('');
THREE.DRACOLoader.setDecoderConfig({type:'js'});

var loader = new THREE.GLTFLoader();
loader.setDRACOLoader(new THREE.DRACOLoader());
loader.load('files/test.gltf', function(gltf){
    gltf.scene.traverse(function(child)){
        if(child.name === 'ring'){
            child.material = new THREE.MeshStandardMaterial({
                color : 0xffffff
            });
            ring = THREE.CSG.fromMesh(child);
            temp = child;
        }
    }
    scene.add(gltf.scene);
})

function engrave(text){
    var fLoader = new THREE.FontLoader();
    fLoader.load('font.json', function (font){
        var fGeometry = new THREE.TextGeometry(text, {
            ...
        });

        var fMaterial = new THREE.MeshStandardMaterial({
            ...
        });

        var font = new THREE.Mesh(fGeometry, fMaterial);

        var csg = THREE.CSG.fromMesh(font);

        var result = mesh.subtract(csg);

        temp.visible = false;
        scene.add(THREE.CSG.toMesh(result, fMaterial);
    });
}

我希望有人回答我的问题。

1 个答案:

答案 0 :(得分:1)

最常用的三个CSG库存在一些问题,在某些情况下无法使用。

我已经移植了自己的CSG库版本,其中包含的此类问题较少。.也许您想尝试使用该库?

https://github.com/manthrax/THREE-CSGMesh