threejs

1.场景清空,释放内容

javascript 复制代码
// 假设你已经有一个Three.js的场景对象scene
 
// 函数:清空场景中的所有对象
function clearScene(scene) {
    while(scene.children.length > 0){
        const object = scene.children[0];
        
        if(object.isMesh) {
            // 如果有几何体和材质,也进行清理
            object.geometry.dispose();
            if(object.material.isMaterial) {
                cleanMaterial(object.material);
            } else {
                // 材质组是数组,所以我们需要遍历它
                for(const material of object.material) cleanMaterial(material);
            }
        }
        
        scene.remove(object);  // 从场景中移除对象
    }
}
 
// 辅助函数:清理材质资源
function cleanMaterial(material){
    material.dispose(); // 清理材质
    if(material.map) material.map.dispose(); // 清理贴图
    if(material.lightMap) material.lightMap.dispose();
    if(material.bumpMap) material.bumpMap.dispose();
    if(material.normalMap) material.normalMap.dispose();
    if(material.specularMap) material.specularMap.dispose();
    if(material.envMap) material.envMap.dispose();
    // ... 清理其他你使用的材质资源
}
 
// 使用方法:
clearScene(scene);

2.选中物体

如果放在像若依这种前端框架中,会有菜单栏导致计算坐标的位置发生偏移

使用clientX配合getBoundingClientRect函数计算坐标即可

相关推荐
军军君013 天前
Three.js基础功能学习十一:动画与音频
前端·javascript·3d·js·threejs·三维
gis分享者4 天前
学习threejs,实现发光信息流效果
threejs·发光·shadermaterial·spheregeometry·信息流·linedashed·vector3
军军君017 天前
Three.js基础功能学习十二:常量与核心
前端·javascript·学习·3d·threejs·three·三维
军军君0113 天前
Three.js基础功能学习七:加载器与管理器
开发语言·前端·javascript·学习·3d·threejs·三维
患得患失9491 个月前
【ThreeJS】camera-controls---高性能动画相机控制库
threejs·camera-controls
接着奏乐接着舞。1 个月前
3D地球可视化教程 - 第6篇:蜂巢网格与自定义几何体
前端·vue.js·3d·threejs
军军君011 个月前
Three.js基础功能学习一:环境资源及基础知识
开发语言·javascript·学习·3d·前端框架·threejs·三维
gis分享者1 个月前
学习threejs,结合anime.js打造炫酷文字粒子星空秀
动画·threejs·粒子·文字·anime·星空·炫酷
gis分享者1 个月前
学习threejs,生成复杂3D迷宫游戏
学习·游戏·3d·threejs·cannon·迷宫·cannon-es
gis分享者2 个月前
学习threejs,使用自定义GLSL 着色器,实现抽象艺术特效
threejs·着色器·glsl·shadermaterial·抽象艺术