工业零部件3D大屏
概览
在工业制造场景中,经常需要展示零部件的各个角度与细节,同时查看生产进度等实时数据。三维场景是在线可视化制作三维场景的编辑器,通过它您可以轻松制作酷炫的三维效果,并集成到大屏中展现。
需求场景
本文以工业零部件在大屏中的 3D 展示为例,用Sugar BI在可视化大屏中添加一个动态、全方位、多角度展示的工业零部件三维场景,并在零部件的某些位置标注实时更新的“生产量”数据。
方案概述
- 登录Sugar BI。
- 配置权限:开发大屏和使用三维场景编辑器需【可视化分析权限】,如需自己完成数据源配置工作,则还需要【数据开发权限】。详细的权限配置方式详见细粒度权限。
- 连接数据源:Sugar BI支持多种方式对接数据源,包括直连数据库、上传 Excel/CSV 文件、API 接口、静态 JSON 录入。
- 创建数据模型:数据模型的作用是将源数据整合处理为适合分析的数据集,为后续工作做数据准备。在数据模型模块,可以将需要的多张数据表关联成一张宽表,并进行逻辑层面的数据处理(如字段重命名、新建计算字段、创建层级、调整字段顺序等操作)
- 新建三维场景:Sugar BI提供在线可视化制作三维场景的编辑器。
- 编辑三维场景:在三维场景编辑器中完成上传模型、编辑镜头动态效果、添加标注等功能。
- 将三维场景嵌入到大屏中:在大屏的编辑页面,做好的三维场景可以通过「三维场景」组件导入至大屏中动态展示。
- 预览和分享:对做好的大屏进行 PC/移动端展示效果的预览,确认无误后生成链接分享给他人。
操作步骤
连接数据源
连接数据源,是指让Sugar BI和我们的数据库(包括 MySQL、Oracle、SQL Server 等)之间建立连接,让Sugar BI能够使用和查询数据库中的数据。以 MySQL 数据库作为示例,假设我们已经有了一个 MySQL 数据库,并且数据库中已有要分析和展示的数据。
数据源的配置详情请见:详细的连接方法。
创建数据模型
数据模型的作用是将源数据整合处理为适合分析的数据集,为后续工作做数据准备。
在数据模型模块,可以将需要的多张数据表关联成一张宽表,并进行逻辑层面的数据处理(如字段重命名、新建计算字段、创建层级、调整字段顺序等操作)。下面介绍一下数据表的建模步骤。更多操作详细介绍见数据模型。
1.新建数据模型
在空间中的「数据模型」管理页面点击「新建数据模型」按钮,即可创建数据模型,选择需要连接的数据源,输入数据模型名称。
2.添加数据表
页面左侧将列出数据源中的所有数据表,拖动要分析的数据表至页面中间区域进行表关联。
3.多表关联
拖入多张数据表,即可实现多表的关联分析(对应为 SQL 语句中的多表 Join)。这里我们选择 sale_customer_type 和 sale_order 数据表,基于共有的“客户种类代码”字段将它们进行表关联。
新建三维场景
在「新建」菜单下选择「三维场景」,填写「名称」后点击「确认」按钮即完成新建三维场景。
编辑三维场景
1.页面介绍
该页面分为 5 个区域,其包含的功能如下:
-绿色区域:添加内容区域,用于添加物体、光源及特效,以及预览和常见设置等。
-红色区域:场景内容列表,这里将会列出场景中的所有内容,方便选择及删除。
-蓝色区域:编辑器工具栏,用于对场景进行编辑。
-黄色区域:属性面板,用于修改某个选中场景内容的参数。
-中间区域:3D 场景的画布区域。
2.导入三维模型
在「内容区域」中点击「添加物体」按钮,导入三维模型。我们选取Sugar BI内置的图片为例,您可以通过右侧「属性面板」更换模型。也可以上传自定义三维模型,(云上 SaaS 版支持最大上传 10MB 的模型文件,私有部署版本中不限制模型文件的大小,建议 20MB 以内),目前支持 ifc/fbx/gltf/glb 格式的模型。
3.编辑镜头动态效果
(1)修改「播放相机」
通过点击右侧属性面板中「初始位置与当前编辑器相机一致」按钮可以将当前编辑器相机里的参数同步到播放相机里,这样在初始浏览的时候就和编辑器当前看到的是一致的。
(2)编辑「播放相机」下的「自动移动」
在画布区域更改模型的位置,点击「添加当前编辑器相机位置」记录当前位置。
已添加至「自动移动」的位置支持详情编辑和排序。
4.在 3D 模型上添加「标注」,并绑定数据
(1)双击模型上的任意位置,即可新增标注
(2)在该「标注」上绑定“生产量”数据
选定包含此零件“生产量”的数据模型,将“生产量”字段绑定在容器中,选择“求和”的聚合方式。此时该零件的实时生产量便显示在「标注」的位置上,可以实现对产量的实时监控。
5.设置场景
(1)选择「场景设置」进行该三维场景的详细设置,包括场景调色、自定义脚本、场景交互。
(2)取消天空盒子
为了无缝嵌入可视化大屏中,可以关掉三维场景默认创建的天空盒子,在场景编辑中点击顶部的「场景设置」,然后在右侧属性面板中关闭「是否创建天空盒子背景」,并将色彩的透明度调整为 0。
6.预览及保存
点击右上角「保存并预览按钮」,即可进入预览页面,当前三维场景即被保存成媒体组件。
将三维场景嵌入到大屏中
1.新建数据可视化大屏并添加除三维场景组件外的其它组件(详见制作可视化大屏或实时滚动地图大屏,然后添加「三维场景」
2.在「控制面板」-「场景选择」中选择刚刚创建好的「三维场景」,此时便成功将 3D 模型嵌入可视化大屏。
预览与分享
1.预览
点击右上角「保存并预览」按钮,即可保存并预览大屏、三维场景及其动态效果。
2.公开分享
在空间看版的「数据大屏」文件夹中选定大屏,在右上角选择‘分享“,或在空间工作台的「智能大屏」页面,点击「公开分享」按钮,即可生成公开分享链接,普通互联网用户点开链接即可访问大屏。
相关产品
立刻开启 Sugar BI 免费试用,解锁更多行业组件与大屏模板!