小红砖 | 前端三维库你不知道的那些事儿(一)
原创发布时间:2020-5-7
小红砖近日更新了前端三维库界面:
1.优化了整体三维浏览界面;
2.快速上手教程文案更新;
3.新版示例库更新;
4.模型对比功能界面优化;
点击蓝字,了解更多:小红砖界面优化,一起畅游三维世界!
为了让大家更加了解小红砖的前端三维库,我将会从以下4个方面为大家介绍。
一、全局属性
二、初始化主应用
三、接口调用及提示消息
项目初始化
接口说明
项目进行初始化,加载内部依赖资源。
传入参数说明
名称 | 描述 | 类型 | 必填 | 示例 |
---|---|---|---|---|
func | 初始化完毕后执行的回调函数 | function | 是 | function() {} |
返回参数说明
名称 | 描述 | 类型 | 示例 |
---|---|---|---|
undefined | 无返回值 |
使用示例
Xhz.init(function(){});
一、全局属性
视图控制器
属性说明
设置视图控制器是否显示,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.EnableViewController | true-显示,false-隐藏。默认值是true。 | boolean |
使用示例
Xhz.attr.EnableViewController = false;
相关示例
点击进入示例库 构件旋转
控制初始视角
属性说明
设置用户是否控制初始视角,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.UserControlView | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.UserControlView = false;
选中构件材质
属性说明
设置构件选中时的材质,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.SelectionColor | 默认值是 {color: 0x3fad00, side: window.THREE && window.THREE.DoubleSide}。 | object |
使用示例
Xhz.attr.SelectionColor = {color: 0x3fad00, side: window.THREE && window.THREE.DoubleSide};
抗锯齿
属性说明
设置是否抗锯齿,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.DisableAntialias | true-是,false-否。默认值是true。 | boolean |
使用示例
Xhz.attr.DisableAntialias = false;
自动合并构件
属性说明
设置是否自动合并构件,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.AutoMergeComponent | true-是,false-否。默认值是true。 | boolean |
使用示例
Xhz.attr.AutoMergeComponent = false;
合并构件的数量阈值
属性说明
设置自动合并构件的数量阈值,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.AutoMergeComponentCount | 默认值是10000。 | number |
使用示例
Xhz.attr.AutoMergeComponentCount = 20000;
显示构件差异
属性说明
设置鼠标覆盖构件时是否显示构件差异,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.Hover | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.Hover = true;
相关示例
点击进入示例库 构件查询
碰撞检测
属性说明
设置是否启用碰撞检测,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.EnableHitDetection | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.EnableHitDetection = true;
选中轮廓线
属性说明
设置是否开启选中轮廓线,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.EnableSelectionOutline | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.EnableSelectionOutline = true;
相关示例
点击进入示例库 模型外轮廓
透明时可选中
属性说明
设置是否开启透明时可选中,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.EnableSelectionByTranslucent | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.EnableSelectionByTranslucent = true;
相关示例
点击进入示例库 透明
显示包围盒
属性说明
设置是否开启选中时显示包围盒,需要在初始化主应用之前使用。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.EnableSelectionBoundingBox | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.EnableSelectionBoundingBox = true;
设置渲染器的阴影
属性说明
设置渲染器的阴影是否出现。
属性值说明
名称 | 描述 | 类型 |
---|---|---|
Xhz.attr.EnableSelectionBoundingBox | true-是,false-否。默认值是false。 | boolean |
使用示例
Xhz.attr.EnableShadow = true;
相关示例
点击进入示例库 阴影
相关文章
评论区