Section
NIVIOBIM剖切功能模块,提供完整的3D模型剖切工具。支持电脑端和移动端的剖切操作,包括剖切盒拖拽和剖切条拉动功能。
类定义
javascript
class Section extends Plugin构造函数
constructor(viewer3D, options)
创建剖切插件实例,初始化剖切工具,设置剖切参数。
参数:
viewer3D{Viewer3D} - Viewer3D实例options{Object} - 插件配置选项
示例:
javascript
// 创建剖切插件
const section = new Section(viewer3D, {
enableBoxDrag: true,
enableBarPull: true,
showBox: true,
boxSize: 100
});属性
enabled
剖切功能是否启用,控制剖切工具是否处于活动状态。
类型: {boolean}
默认值: false
示例:
javascript
// 启用剖切功能
section.enabled = true;
// 禁用剖切功能
section.enabled = false;
// 检查剖切功能是否启用
if (section.enabled) {
console.log('剖切功能已启用');
}Box
剖切盒对象,返回当前剖切盒的引用。
类型: {SectionBox}
只读: true
示例:
javascript
// 获取剖切盒对象
const box = section.Box;
console.log('剖切盒对象:', box);boxVisible
剖切盒是否可见,控制剖切盒的显示和隐藏。
类型: {boolean}
只读: true
示例:
javascript
// 检查剖切盒是否可见
if (section.boxVisible) {
console.log('剖切盒可见');
} else {
console.log('剖切盒隐藏');
}planes
剖切面数组,返回六个剖切面的数组。
类型: {Array<Plane>}
只读: true
示例:
javascript
// 获取剖切面数组
const planes = section.planes;
console.log('剖切面数量:', planes.length);方法
setBoxVisible(boolean)
设置剖切盒可见性,控制剖切盒的显示和隐藏,同时控制拖拽功能的启用状态。
参数:
boolean{boolean} - 是否显示剖切盒,true为显示,false为隐藏
示例:
javascript
// 显示剖切盒
section.setBoxVisible(true);
// 隐藏剖切盒
section.setBoxVisible(false);reset()
重置剖切盒,将剖切盒恢复到默认状态,包括大小、位置和可见性。
示例:
javascript
// 重置剖切盒
section.reset();dispose()
销毁剖切插件,清理插件资源,移除剖切盒,释放事件监听器,还原材质属性。
示例:
javascript
// 销毁剖切插件
section.dispose();getBoxInterval()
获取剖切盒区间,返回剖切盒的包围盒区间。
返回值:
- {Box3} 剖切盒区间
示例:
javascript
// 获取剖切盒区间
const interval = section.getBoxInterval();
console.log('剖切盒区间:', interval);getPlaneInterval()
获取剖切面区间,返回剖切面的包围盒区间。
返回值:
- {Box3} 剖切面区间
示例:
javascript
// 获取剖切面区间
const interval = section.getPlaneInterval();
console.log('剖切面区间:', interval);事件
update
剖切状态更新时触发,当剖切盒位置、可见性或剖切参数发生变化时触发。
示例:
javascript
section.addEventListener('update', () => {
console.log('剖切状态已更新');
});drag
剖切盒拖拽时触发,当用户拖拽剖切盒时触发。
事件数据:
object{Object} - 拖拽的对象pointerType{string} - 指针类型(mouse、touch、pen)
示例:
javascript
section.addEventListener('drag', (event) => {
console.log('剖切盒拖拽中,指针类型:', event.pointerType);
});dragstart
剖切盒拖拽开始时触发,当用户开始拖拽剖切盒时触发。
事件数据:
object{Object} - 拖拽的对象pointerType{string} - 指针类型(mouse、touch、pen)
示例:
javascript
section.addEventListener('dragstart', (event) => {
console.log('剖切盒拖拽开始,指针类型:', event.pointerType);
});dragend
剖切盒拖拽结束时触发,当用户结束拖拽剖切盒时触发。
事件数据:
object{Object} - 拖拽的对象pointerType{string} - 指针类型(mouse、touch、pen)
示例:
javascript
section.addEventListener('dragend', (event) => {
console.log('剖切盒拖拽结束,指针类型:', event.pointerType);
});hoveron
鼠标悬停开始时触发,当鼠标悬停在剖切盒上时触发。
事件数据:
object{Object} - 悬停的对象pointerType{string} - 指针类型(mouse、touch、pen)
示例:
javascript
section.addEventListener('hoveron', (event) => {
console.log('鼠标悬停开始,指针类型:', event.pointerType);
});hoveroff
鼠标悬停结束时触发,当鼠标离开剖切盒时触发。
事件数据:
object{Object} - 悬停的对象pointerType{string} - 指针类型(mouse、touch、pen)
示例:
javascript
section.addEventListener('hoveroff', (event) => {
console.log('鼠标悬停结束,指针类型:', event.pointerType);
});hoverout
鼠标移出时触发,当鼠标完全移出剖切区域时触发。
事件数据:
pointerType{string} - 指针类型(mouse、touch、pen)
示例:
javascript
section.addEventListener('hoverout', (event) => {
console.log('鼠标移出,指针类型:', event.pointerType);
});使用场景
建筑剖切
- 建筑模型的剖面展示
- 内部结构分析
- 空间关系展示
工程剖切
- 管道系统剖切
- 设备内部结构展示
- 安装空间分析
教学演示
- 3D模型内部结构教学
- 空间关系演示
- 结构分析展示
设计审查
- 设计细节检查
- 空间布局验证
- 结构合理性分析
操作说明
电脑端操作
- 剖切盒拖拽:拖拽剖切盒进行剖切活动
- 剖切条拉动:拉动剖切条进行剖切活动
移动端操作
- 触控拖拽:触控拖拽剖切盒进行剖切活动
- 触控拉动:触控拉动剖切条进行剖切活动
- 双指缩放:调整剖切盒大小
剖切盒可见性控制
- 剖切盒可见时:无法选中剖切物体,视点始终位于剖切盒中心,视点追踪关闭
- 剖切盒不可见时:可以选中被剖切的物体,视点位于旋转时的触控点,视点追踪开启