官方示例(十六):3D场景中BIM剖切面参数化开发ThingJS

three.js 拖拽剪切构成剖面图 示例效果: 前言: 中间的图像块内容构建涉及保密数据,不做说明。只做如题相关的代码及说明。 拖拽 这里使用的是 DragControls这个类 该类提供一个drag 和drop 的交互。使用方法很简单,将需要挂载事件的object3D 对象数组、相机实例、dom传进去即可。 实例代码 // 注册事件. registerRaycsterEvent: function (objects) { //点击射线 let _this = this 阅读详情

#前端# #BIM# #物联网可视化开发#

  1. 3D场景内的模型剖切
  2. 剖切对象初始化
  3. 剖切面事件控制
    在这里插入图片描述

简介:建筑楼宇是一个实体,室内往往被遮挡,对于建筑设计、楼宇管理和设备维护造成了一定的困难。如果想了解房屋内部的复杂构造情形,这时候利用假想的剖切面进行几何切割,室内的构造情况露出。ThingJS引入了3D剖切面功能,参数化开发方法更精确,直接在屏幕呈现剖切效果。

demo链接:http://www.thingjs.com/guide/?m=sample

3D场景内的模型剖切

ThingJS支持对模型的方盒子六面剖切以及任意面剖切,让我们来看看官方示例示怎么做到的吧。如效果图所示,在3D场景视图内生成一个矩形剖切框,顺应箭头所指的方向长按鼠标拖动可剖切模型。
初始化剖切功能的操作环境,需要考虑的一点,就是如何快速准确剖切想要的位置?

剖切对象初始化

涉及到的剖切对象是要进行剖切的建筑,首先查询该建筑,设置建筑为不可拾取的状态,包括建筑内部楼层。
开启剖切动作之后,建筑周围出现剖切包围盒,基于对象创建更多样式提高辨识度。
步骤一,创建剖切包围盒的几何体,其中type值可以为plane, box, sphere等
步骤二,设置父物体为剖切方向的箭头,拖动指引箭头则剖切面会被激活
步骤三,设置剖切面样式,如颜色、透明度、双面渲染,以包围盒的效果出现

/**
 * 创建方向箭头和剖切面
 */
function create() {
   
   
    if (cuttingPlane == null) {
   
   
        
three.js 切割模型动画,并且播放 因为公司没有人会用blender,所以动画都是用max做的,动画师一般都是会把多个动画做在一个模型上,然后程序中需要使用的话,调用指定的帧数。unity可以把动画切割成animationclip。最近公司使用了需要在three.js中添加一个模型,模型带了一段长动画,所以我这边就是需要把模型的指定帧数之间的动画切割出来。 接下来演示部分: 1.准备素材一段带动画的素材 初始化,加入相机,灯光模型等元素 function init() { var canHeight = window. 阅读详情

相关推荐

three.js中模型的裁剪

用于裁剪three.js中模型的裁剪。最新版。与three.js模型连用时,用网上的裁剪代码不会出错

three.js模型剖切功能的实现

多个面剖切(xOy平面、xOz平面、yOz平面),可以随意调节,可以实现将剖切口封装(住),支持鼠标拖拽调节剖切面。 资源来自开源github网站,故不设置积分。 国内浏览github极其慢,经常由于网络原因下载失败,故将此资源放置在优快云,方便大家学习,发扬IT开源共享精神,共同促进IT进步。

基于Opencv+Mediapipe的头部姿态检测

在学生课堂专注度检测项目中,可以通过学生头部姿态来确定学生注意力方向,从而判断其是否专注于课堂。

weixin_67879842的博客 2339

BurpSuit在不同浏览器中配置代理

文章通过分享各大浏览器如何设置代理的知识,帮助初学者快速掌握代理配置相关技能。

北冥同学的成长记录笔记 1万+

Oracle到金仓数据库信创改造迁移实施规划方案

**性能测试和优化**:对金仓数据库的性能进行测试,根据业务负载情况进行必要的调优,确保系统能够稳定高效运行。- **数据兼容性**:评估Oracle数据库中的数据结构和金仓数据库的兼容性,明确需要重构的数据模型。- **性能测试**:通过对金仓数据库的性能测试,预估在实际业务环境下的表现,是否能达到业务需求。- **工具选择**:选择适合的迁移工具,如金仓数据库提供的迁移工具,能够提升迁移效率和准确性。- **全面迁移**:在初步迁移成功后,进行全面数据迁移,确保所有数据完整迁移到金仓数据库上。

hdrhdrjdididrr的博客 482

【人工智能】AI算法系统设计与算法建模的详细阐述

AI算法系统设计与算法建模是人工智能领域中的核心任务之一,它涉及从问题定义、数据收集、算法选择、模型构建到系统部署的全过程。以下是对AI算法系统设计与算法建模的详细阐述

weixin_51306394的博客 4356

避开内存陷阱:手把手教你用RKNN零拷贝接口正确管理输入输出Tensor

本文深入解析RKNN零拷贝接口在边缘计算中的高效内存管理策略,通过YOLOX实例演示如何避免内存对齐错误和数据错位。详细介绍了`rknn_tensor_mem`系列API的正确使用方法,包括内存创建、绑定、释放全流程,以及性能优化技巧如内存池技术和多核NPU负载均衡,帮助开发者提升推理效率并避开常见陷阱。

weixin_33686714的博客 160

别再为环保数采仪通讯发愁!手把手教你用MCGS触摸屏+4G模块发送HJ212报文

本文详细介绍了如何使用MCGS触摸屏配合4G模块高效发送HJ212标准报文,解决工业环保监测中的数据采集与传输难题。从硬件连接到软件配置,再到报文组装与发送策略,提供全流程实用指南,特别针对4G网络环境下的特殊设置给出优化建议,帮助工程师提升数据传输稳定性与效率。

weixin_30847865的博客 389

VS(QT)调用Matlab函数的方法

调试–>窗口–>异常设置–>Win32 Exceptions全部不要勾选。选择Microsoft Visual C++ 2017。将生成的.h和.lib分别放置在对应的文件夹。输入mex -setup C++输入deploytool选择。选择Realse x64。

woshigaowei5146的博客 592

【DRAM存储器六十六】DDR5介绍--训练相关之CA/CS Training

详述DDR5 CA/CS training过程细节

highman110的博客 200

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

ET2012新版免狗免安装绿色软件

ET2012新版免狗免安祖昂绿色软件。,新界面,新视觉,

廖雪峰Python教程[完整版]

廖雪峰的python教程整理的,已经排好版了,而且还是完整的,适合小白

上一篇: 官方案例(十五):3D开发构造器参数测量多边形面积 ThingJS
下一篇: 数字孪生城市,如何破旧立新?ThingJS
ThingJS_小锘
博客等级 码龄6年 170粉丝 254原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值