Three.js 模型切割:交集并集查集计算(ThreeBSP)

最新推荐文章于 2022-07-29 10:43:01 发布

_Zou

最新推荐文章于 2022-07-29 10:43:01 发布

阅读量1.5k

点赞数

分类专栏： webgl笔记文章标签：数据可视化 javascript html5

zouzouzou

本文链接：https://blog.csdn.net/weixin_40676050/article/details/108185537

版权

webgl笔记专栏收录该内容

16 篇文章 3 订阅

订阅专栏

ThreeBSP.js功能概述

注：若geometry为BufferGeometry无效；

直接上代码：

$("#threeBSP_intersect").click(function () {
    //生成ThreeBSP对象
    var sphereBSP = new ThreeBSP(sphere);
    var cubeBSP = new ThreeBSP(cube);
    //进行交集计算
    var resultBSP = sphereBSP.intersect(cubeBSP);
    //从BSP对象内获取到处理完后的mesh模型数据
    var result = resultBSP.toMesh();
    //更新模型的面和顶点的数据
    result.geometry.computeFaceNormals();
    result.geometry.computeVertexNormals();
    //重新赋值一个纹理
    var material = new THREE.MeshBasicMaterial({color: 0xCC00FF});
    result.material = material;
    result.position.x=-3;
    scene.add(result);
})
$("#threeBSP_subract").click(function () {
    //生成ThreeBSP对象
    var sphereBSP = new ThreeBSP(sphere);
    var cubeBSP = new ThreeBSP(cube);
    //进行并集计算
    var resultBSP = cubeBSP.subtract(sphereBSP);
    //从BSP对象内获取到处理完后的mesh模型数据
    var result = resultBSP.toMesh();
    //更新模型的面和顶点的数据
    result.geometry.computeFaceNormals();
    result.geometry.computeVertexNormals();
    //重新赋值一个纹理
    var material = new THREE.MeshBasicMaterial({color: 0xCC00FF});
    result.material = material;
    result.position.x=3;
    scene.add(result);
})
$("#threeBSP_union").click(function () {
    //生成ThreeBSP对象
    var sphereBSP = new ThreeBSP(sphere);
    var cubeBSP = new ThreeBSP(cube);
    //进行并集计算
    var resultBSP = sphereBSP.union(cubeBSP);
    //从BSP对象内获取到处理完后的mesh模型数据
    var result = resultBSP.toMesh();
    //更新模型的面和顶点的数据
    result.geometry.computeFaceNormals();
    result.geometry.computeVertexNormals();
    //重新赋值一个纹理
    var material = new THREE.MeshBasicMaterial({color: 0xCC00FF});
    result.material = material;
    result.position.x=0;
    scene.add(result);
})