Three.js中文网 Three.js中文网
首页
免费视频
系统课 (opens new window)
  • Three.js基础课程
  • Vue3+Threejs 3D可视化
  • Threejs进阶课程
  • 展厅3D预览漫游
  • Threejs Shader
  • Blender建模基础
  • Three.js基础课程(旧版本) (opens new window)
  • 文章
WebGPU教程
  • WebGL教程
  • WebGL教程(旧版本) (opens new window)
3D案例
  • 本站部署(打开快) (opens new window)
  • 原英文官网文档 (opens new window)
首页
免费视频
系统课 (opens new window)
  • Three.js基础课程
  • Vue3+Threejs 3D可视化
  • Threejs进阶课程
  • 展厅3D预览漫游
  • Threejs Shader
  • Blender建模基础
  • Three.js基础课程(旧版本) (opens new window)
  • 文章
WebGPU教程
  • WebGL教程
  • WebGL教程(旧版本) (opens new window)
3D案例
  • 本站部署(打开快) (opens new window)
  • 原英文官网文档 (opens new window)
Web3D系统课程视频
  • 0.学前说明

  • 1.Three.js快速入门

  • 2.几何体BufferGeometry

  • 3.模型对象、材质

  • 4.层级模型

    • 1. Vector3与模型位置、缩放属性
    • 2. 遍历模型树结构、查询模型节点
    • 3. 本地坐标和世界坐标
    • 4. 改变模型相对局部坐标原点位置
    • 5. 移除对象.remove()
      • 6. 模型隐藏或显示
    • 5.顶点UV坐标、纹理贴图

    • 6.加载外部三维模型(gltf)

    • 7.PBR材质与纹理贴图

    • 8.渲染器和前端UI界面

    • 9.生成曲线、几何体

    • 10.相机基础

    • 11.光源和阴影

    • 12.精灵模型Sprite

    • 13.后处理EffectComposer

    • 14.射线拾取模型

    • 15.场景标注标签信息

    • 16.关键帧动画

    • 17.动画库tween.js

    • Three.js教程
    • 4.层级模型
    郭隆邦
    2023-01-26
    目录

    5. 移除对象.remove()

    # 移除对象.remove()

    前面课程给大家讲解过.add()方法,比如可以通过.add()可以把模型或光源添加到场景中。

    group.add(mesh);
    scene.add(group);
    scene.add(light);
    

    .remove()方法和.add()方法是相反的,是把子对象从父对象的.children()属性中删除。

    # 查看父类Object3D的移除方法.remove()

    场景对象Scene、组对象Group、网格模型对象Mesh的.remove()方法都是继承自它们共同的基类(父类)Object3D。

    # .remove()方法使用

    .add()方法是给父对象添加一个子对象,.remove()方法是删除父对象中的一个子对象。

    // 删除父对象group的子对象网格模型mesh1
    group.remove(mesh1);
    
    scene.remove(ambient);//移除场景中环境光
    scene.remove(model);//移除场景中模型对象
    

    通过.remove()方法删除父对象的子对象之后,可以通过浏览器控制台查看.children()属性的变化。

    console.log('查看group的子对象',group.children);
    

    # 一次移除多个子对象

    group.remove(mesh1,mesh2);
    
    4. 改变模型相对局部坐标原点位置
    6. 模型隐藏或显示

    ← 4. 改变模型相对局部坐标原点位置 6. 模型隐藏或显示→

    Theme by Vdoing | Copyright © 2016-2025 豫ICP备16004767号-2
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式