【乐吾乐3D可视化组态编辑器】模型类型与属性

编辑器地址:3D可视化组态 - 乐吾乐Le5le

本章主要为您介绍模型的属性功能。

一个模型至少会包含一个节点(Node),从节点类型上可以分为转换节点(TransformNode)、网格(Mesh)、实例网格(InstancedMesh)。此外,系统自带了一种特殊的模型,即面板,它本质也是网格,只是材质固定为高级动态纹理。

下面我们详细介绍下这几种节点的区别以及可以设置的属性。

转换节点

转换节点没有实体,不会渲染,它一般用作网格的变换中心,当它的位置、缩放或者旋转值发生改变时,它下面挂载的子节点会以转换节点为中心发生改变。

转换节点是其他模型节点的父类,因此它可以设置的属性其他模型节点也都可以设置。

名称

模型节点的名称,不同节点名称可以重复。

数据类型:string

所属分组

模型节点所在的分组,一个节点可以设置到多个分组中。

数据类型:string[]

启用

是否显示节点,当关闭时,会隐藏当前节点及其所有子节点,并且在画布中不可被拾取。

数据类型:boolean

位置

节点的坐标点。如果节点为根节点,表示绝对坐标,如果节点有父节点,表示以父节点所在位置为原点的相对坐标。

数据类型:number

缩放

节点的缩放值。

数据类型:number

旋转

节点的旋转值,单位为角度。

数据类型:number

网格

3D场景中模型的形状是由网格构建的,每个网格都是由三角形的面连接在一起,每个面有三个顶点。模型越复杂,网格中的点和面就越多,对性能的要求就越高。因此在建模的时候,我们应该尽量精简点面的数量。我们可以通过添加材质和贴图来为网格覆盖颜色和图片,不同的材质表现的效果也不同。

网格是转换节点的子类,因此它也具有转换节点的属性。下面我们详细介绍网格特有的属性。

基础

可拾取

点击左键时,网格是否可以被拾取到。如果设置为不可拾取,在编辑状态下不可被左键选中(但是可以在结构中被选中),在运行状态下不会触发鼠标相关事件。

数据类型:boolean

透明度

改变网格的透明度,范围0-1,0表示完全不可见,1表示完全可见。只对自身有效,不会改变子节点的透明度。不会影响网格拾取。

数据类型:number

接收阴影

网格表面是否显示阴影。

数据类型:boolean

生成阴影

网格是否可以产生阴影。

数据类型:boolean

固定朝向

可以设置网格相对于相机的显示方向。当您需要模型始终面向相机时,可以设置此属性为水平面向相机或者垂直面向相机。

数据类型:number,0不固定,

渲染层级

设置网格在场景中的渲染层级。当您需要在场景上层始终显示网格,不希望被遮挡时,可以设置此属性为置顶。

数据类型:number

材质

我们可以给网格添加材质以显示出不同的效果,系统目前支持PBR材质、网格材质、渐变材质、水材质、节点材质等。

PBR材质

PBR即基于物理的渲染,它可以通过计算光线与物体表面的交互状态而实现模拟真实世界的画面。当配置了HDR后,模型表面即会反射出周围环境的效果,且HDR仅对PBR材质生效。

金属光泽

模型表面的金属光泽度,值越高,金属质感越强。范围0 - 1。

数据类型:number

金属因子

材质反射的亮度,值越高,反射亮度越强。

数据类型:number

粗糙度

模型表面的粗糙程度,值越高,表面显得越不光滑。范围0 - 1。

数据类型:number

漫反射色

材质在灯光下观察到的颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

自发光色

材质自身的颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

混合光影映射

开启后材质将光照贴图中获取阴影信息

数据类型:boolean

环境纹理强度

材质的环境纹理(ao)贴图影响因子,值越大,环境纹理贴图对材质的影响越大。

透明度

材质的透明度,值越小,材质显得越透明。范围0 - 1。

数据类型:number

透明模式

透明模式分为混合与叠加,材质或材质中的帖图含有透明时,默认为混合。将透明模式改为叠加后,材质遇到许多网格重叠的情况是,网格会发亮。

隐藏背面

当相机旋转到该材质背面时是否隐藏材质。

数据类型:boolean

网格材质

可在模型表面显示出网格的材质。

网格色

网格块的颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

线条色

网格线的颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

线条缩放

线条间隔相对于模型的缩放比例。值越大,线条间隔越宽。

数据类型:number

透明度

同PBR材质-透明度。

隐藏背面

同PBR材质-隐藏背面。

渐变材质

水材质

1、凹凸纹理:水材质的形状法线贴图,需要一张法线贴图

2、波峰、波长、跳跃高度绝对每一条水波的高低起伏

3、流速,控制水面的流动速度

4、水色,控制水面的颜色

5、默认反射天空盒

节点材质

使用BJS节点编辑器,连接节点自定义材质。

纹理

当材质设置为PBR材质或者水材质时,您可以为材质添加纹理。系统支持的纹理有以下几种:

  1. 漫反射纹理:在灯光下观察到的纹理。
  2. 自发光纹理:无灯光时也能观察到的纹理。
  3. 环境纹理:又称作遮挡纹理,它可以把烘焙阴影添加到材质。
  4. 光照纹理:将预先计算的网格的光照信息存储在纹理中,可以减少处理光照的计算量。
  5. 反射纹理:可以显示反射的纹理。
  6. 凹凸纹理:存储用于置换纹理中网格的表面法线数据,可以模拟渲染表面的凹凸和凹痕。

下面介绍这些纹理可以设置的属性。

贴图

设置纹理贴图的资源路径。

数据类型:string

UV坐标索引

定义要使用的UV通道,从0开始,默认为0。

数据类型:number

包含RGBD

纹理是否包含RGBD数据。

数据类型:boolean

纹理透明

定义纹理是否可以透明显示。

数据类型:boolean

坐标模式

定义如何映射纹理。

数据类型:number

横向(u)偏移

定义纹理在U坐标上的偏移量。

类型:number

纵向(v)偏移

定义纹理在V坐标上的偏移量。

类型:number

横向(u)缩放

定义纹理在U坐标上的缩放量。

类型:number

纵向(v)缩放

定义纹理在V坐标上的缩放量。

类型:number

实例网格

当场景中有大量重复模型时,比如树林、人群等,如果每个模型都是单独的网格会非常消耗性能,比较好的解决办法是使用实例网格。实例网格与源网格共用顶点、几何体以及材质,这样会减少资源消耗,加快场景渲染速度。您可以通过复制为引用来创建模型的实例,我们也支持导入GLB本身自带的实例网格。当源模型被删除时,所有基于其创建的实例模型都会被删除。并且实例模型可配置的属性,以及动画、数据、交互等都是独立的,不会被源模型影响。

实例网格可以配置的属性与转换节点完全一致,您可以参考转换节点的属性介绍。

除此之外,系统在基础属性中提供了选择源模型的按钮,用来快速选中实例网格的源模型。

面板

面板是一种特殊的网格,它用来在场景中展示2D信息,例如设备的温度、描述、名称等。

面板的属性包括网格中的所有基础属性,您可以参考网格 - 基础属性介绍。另外,面板无法更改材质。

您可以点击基础属性下方的编辑面板内容按钮,在弹窗中通过面板编辑器来设置要显示的内容。

面板编辑器的操作和场景编辑器类似,左侧为面板支持的显示内容,右侧为属性配置栏,当没有选中内容时,右侧显示的是面板整体的配置属性,当选中某个内容时,右侧显示的是该内容类型对应的配置属性。

面板属性

宽度

面板的宽度,最好取2的整数倍。默认为1024。

数据类型:number

高度

面板的高度,最好取2的整数倍。默认为1024。

数据类型:number

背景色

面板的背景颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

背景图片

面板的背景图片地址。

数据类型:string

填充方式

设置背景图片填充到面板上的方式。1代表拉伸,图片会同时放大或缩小宽高来铺满背景,缺点是不会保持原比例。2代表适应,图片会保持原有的宽高比例并尽可能的最大显示,缺点是会有空白区域。默认为拉伸。

数据类型:number

文本属性

名称

内容块的名称。在同一面板列表中不能重复。

数据类型:string

距左

内容块左上角顶点至面板左侧的距离。

数据类型:number

距上

内容块左上角顶点至面板顶部的距离。

数据类型:number

宽度

内容块的宽度。

数据类型:number

高度

内容块的高度。

数据类型:number

透明度

内容块的透明度。范围0 - 1。

数据类型:number

背景颜色

内容块的背景颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

文本

内容块显示的文字。

数据类型:string

颜色

文字颜色。

数据类型:十六进制颜色或者RGB颜色字符串。例如 #ffffff 或者 rgb(255, 255, 255)。

字体

文字字体。

数据类型:string

粗细

文字粗细。100 - 细,500 - 正常,900 - 粗。

数据类型:string

字号

文字大小。

数据类型:number

水平对齐

文字在内容块中水平的位置。start - 居左,center - 居中,end - 居右。

数据类型:string

垂直对齐

文字在内容块中垂直的位置。start - 居上,center - 居中,end - 居下。

图片属性

名称、距左、距上、宽度、高度、透明度、背景颜色均与文字属性相同。

图片

内容块显示的图片地址。

数据类型:string

填充方式

同面板属性的填充方式。

操作

目前面板编辑器支持的操作有:

  1. 添加内容:拖拽左侧内容块至面板显示区,即可生成对应内容。
  2. 选择内容:鼠标左键点击内容块,或者从列表中点击。
  3. 删除内容:选择内容后按Delete或者Backspace,也可从列表中点击删除按钮。
  4. 取消选择:Esc或者点击面板显示区非内容块的地方。
  5. 复制内容:按住Ctrl后鼠标拖拽内容块。
  6. 置顶:点击工具栏置顶按钮。
  7. 置底:点击工具栏置底按钮。
  8. 撤销:点击工具栏撤销按钮,或者Ctrl+Z。
  9. 恢复:点击工具栏恢复按钮,或者Ctrl+Shift+Z。
相关推荐
崔庆才丨静觅6 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
passerby60616 小时前
完成前端时间处理的另一块版图
前端·github·web components
掘了6 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅6 小时前
实用免费的 Short URL 短链接 API 对接说明
前端
崔庆才丨静觅7 小时前
5分钟快速搭建 AI 平台并用它赚钱!
前端
崔庆才丨静觅7 小时前
比官方便宜一半以上!Midjourney API 申请及使用
前端
Moment7 小时前
富文本编辑器在 AI 时代为什么这么受欢迎
前端·javascript·后端
崔庆才丨静觅8 小时前
刷屏全网的“nano-banana”API接入指南!0.1元/张量产高清创意图,开发者必藏
前端
剪刀石头布啊8 小时前
jwt介绍
前端
爱敲代码的小鱼8 小时前
AJAX(异步交互的技术来实现从服务端中获取数据):
前端·javascript·ajax