4.1 三维可视化零代码平台教程-数字孪生三维可视化项目快速搭建流程
本次教程将以地铁三维可视化项目为例进行完整的三维可视化系统搭建,通过鼠标一键拖拽城市、园区、室内三维场景到三维可视化项目中,然后快速配置自定义背景图片、标注、气泡弹窗和IOT设备等数据,实现孪生体的详情信息查看、运动、告警、发光等效果。
一、目标三维场景添加
在【三维场景】中选择智慧地铁站三维场景中拖拽至画布中,添加地铁三维场景到可视化平台中。
二、二维图片素材添加
在【页面组件】的【选择图标】中选择目标元素素材拖拽至画布中。
- 自定义图片元素上传
在【页面组件】中选择【我的上传】-【图片上传】,点击上传图片按钮选择想要上传的图片文件进行上传;注意自定义图片上传的格式要求为:jpg、png、apng、gif格式文件;文件名称不得含有空格或者特殊字符;图片大小不得超过5m;上传成功后即可在【图片上传】列表中查看,拖拽至画布即可使用;
在右侧【属性面板】中的属性调整面板将画布中选中的元素透明度、大小、位置等信息调整至目标参数。
三、文本内容添加
- 添加项目文本内容
在左侧【页面组件】中【文本组件】选择文本组件拖拽至画板中,目前提供普通文本、渐变文本和数字翻页器用户选择;
- 调整文本参数
可以在右侧【属性面板】中调整拖拽的文本调整文本内容,文本对齐方式和文本样式属性。
四、图表组件添加
- 添加图表组件
首先在【页面组件】-【选择图表】中点选想要的图表并拖拽到页面中,选中在页面添加好的图表元素,可以在右侧【属性面板】中对图表进行自定义修改,包括坐标轴、图表颜色、图例、尺寸等进行编辑。
- 数据设置
针对图表的数据内容可在右侧【数据绑定】模块中进行数据导入,可通过静态数据方式通过直接修改表格内的数据内容来修改图表数据,在动态数据中可接入数据接口进行图表内容同步数据源内容;
五、组合修改
现在项目中有大量图层内容,我们需要针对页面模块进行操作时,就需要通过组合功能进行批量化操作,选中画布中需要组合的图层,鼠标点击右键选择【组合】,成功创建一个新建组合,在右侧可修改图层名称;可针对图层组合进行移动、缩放、显隐等调整操作;
在需要取消组合时,选中目标组合,鼠标右键选择【取消组合】则可取消该组合;
- 设置展示层级
在项目编辑过程中需要调整图层的前后遮挡关系,有两种方式进行图层展示层级进行调整:
1、可通过选中目标图层鼠标右键选择【上一层】、【下一层】、【置顶】、【置底】等快捷操作;注意该方式仅针对单个图层进行,组合不可用;
2、选中目标内容后,右侧属性面板中【显示层级】代表图层的优先级,其中数值推荐区间为1-1000,注意不可为0、小数;通过调整显示层级后即可调整画布中的图层展示优先级;