[{"id":"bcb0874d-299b-448e-9552-9e9b25ef80dd","tags":[{"product":null,"links":null,"id":"ba7e818e-4f6b-4211-b1ac-58e3bafcf439","name":"\u66F4\u65B0","color":"orange","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"8ce3627e-9e58-471b-9133-4f135d191e7b","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"ae60ae59-34f5-4f32-a8eb-243ed1457543","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"3d4848c3-910f-4ffa-9153-60bb507334a9","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"133f4ca6-d951-4d65-a618-3dc6301266f7","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"de62ec1c-813e-40b1-8160-a4cd109afe64","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"2426c71d-8332-4cbd-a436-1ec4f8666464","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"2ce7b6b0-78aa-4e4b-bf8a-e4ba2f988298","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"4706db46-0811-4652-8f59-1e0a1da84758","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"8f1271bb-2cd9-4f39-9897-c15b239ee7ab","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"677e13a7-6f3e-449f-986c-2c3a26f8d54f","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"5e40f6dc-caec-49d7-a1d0-be65f06815ba","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"2457f0e0-9e71-4860-a87d-065e0fb84f84","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"d5c67fd0-1145-482c-9113-97b492c44c18","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"a609a8fa-ab91-4c1d-a1c3-d209d0463303","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]},{"id":"b4a9eb15-94e5-48df-b218-a24138f0cf9c","tags":[{"product":null,"links":null,"id":"adf72f47-7f61-4239-8392-b9bcc127fa80","name":"\u65B0\u589E","color":"green","productId":"0995490e-43fc-4d6e-bc8d-8e66f38b0c63"}]}]
在仪表板中使用 3D 场景组件时,必须提前准备好场景文件,场景文件中除了设计模型场景相关的信息,还定义了数据、参数、格式化等信息。
本文以一个示例来讲解如何创建3D场景文件。
3D 场景中需要使用模型来支撑显示整个场景和数据,所以需要提前将模型准备好。支持两种准备方式:
方式一:将模型文件上传至系统
在文档门户首页单击加号,上传模型,支持 .glb 格式。
方式二:准备一个可用的模型链接,如 https://xxxxxxxx.com.cn/3dmodel.glb
在文档门户首页单击加号,选择3D场景。
进入设计器,先来分区了解一下整个设计器。
编号 | 描述 | 说明和截图 |
---|---|---|
A | 场景菜单
| |
B | 画布区域。
| |
C | 属性设置和数据绑定区。
| |
D | 撤销、重做、保存、预览。 |
将第1步中准备的模型添加到 3D 场景中,支持共享模型和外部链接两种方法。
共享模型是提前上传到系统中的文件;切换到外部链接可添加模型链接。
这里以使用共享模型为例截图。
对导入的模型进行场景建模,使其符合使用需求。
鼠标悬浮画布区域,滚动滚轮进行缩放,拖动调整视角,全方位观察模型。
在左侧可展开模型结构,显示出包含的节点。单击选中模型节点,在右侧可以设置名称,模型变换以及轮播相机设置。
节点名称是匹配数据的关键,该名称必须是数据图层模型节点绑定字段中的值。
比如我们最终想要展示各客户地区的销售额,每个小房子代表一个客户地区。那么节点名称就必须是客户地区中的值,这样才能匹配上数据集或模型中的数据。
实际设置时,如果已经了解字段中的值,就可以直接输入。比如我十分了解将要使用的数据,客户地区中包含的字段有“东北”、“西北”等等。那就可以直接输入模型节点的名称。
您也可以先在数据图层绑定数据(详见本页中设置数据相关介绍)。
然后回到模型建模中,点击下拉按钮直接选择模型节点中绑定的数据即可。
模型变换大类下显示和设置模型节点的平移、旋转或缩放倍数。将各个模型节点调至合适的位置、角度和大小。
利用右下角的功能健也可快速实现对模型节点的缩放、旋转和平移。
当场景开启轮播功能后,会轮流聚焦绑定数据的模型节点,详见开启轮播功能。
这里的轮播相机设置就是用来设置轮播聚焦当前模型节点时的相机视角。
两种设置方法:
直接输入数据,点击预览相机位置;
在画布中拖动模型,角度合适后点击应用编辑器相机位置。此时数据也会显示在属性设置中。
Alpha弧度指的是水平方向的旋转弧度;Beta弧度指的是垂直方向的旋转弧度,范围为0.01到1.57;距离指的是相机到模型的距离,范围为0到500。
还支持向场景中添加光源,支持平行光、点光源和聚光灯效果。
选中光源,在右侧可调整强度。
模型的数据最终是以数据标签的形式呈现出来的,通过模型节点的名称和绑定的数据对应起来。
如下图所示,点击左侧的数据图层图标打开数据图层设计界面,然后点击添加按钮添加数据图层。
选择数据图层就可以在右侧数据绑定面板中进行数据绑定,具体使用方法与仪表板中完全一致。绑定数据之后,模型中将显示出数据标签(示例中我们修改了两个房子的名称,所以仅显示了两组数据)。
还可以进一步定制标签内容,点击提示标签右侧的更多按钮,选择设置。
在设置窗口中可以设置标签显示的内容以及字体样式或可以手动输入内容。也可以单击右上角的 按钮,插入组件中绑定的字段,
效果如下:
点击属性设置设置标签的外观。
大类 | 项目 | 说明 |
---|---|---|
模型标签 | 名称 | 当前选中的数据标注的名称,可重命名。 |
显示模式 | 总是:数据标注一直显示。 点击:鼠标点击对应模型元素时才显示。 悬浮:鼠标悬浮至对应的模型元素时才显示。 隐藏:数据标注一直隐藏。 | |
字体设置 | 设置数据标注的字体样式,包括字体类型、大小、颜色,加粗,斜体等。 | |
背景颜色 | 设置数据标签的背景颜色。 | |
背景图片 | 设置标签的背景图片,关于添加图片时的具体操作请参考图片。 | |
边框颜色 | 设置数据标注的边框颜色。 | |
边框圆角 | 设置数据标注的边框圆角弧度。 | |
条件格式化 | 添加条件格式化,使满足条件的数据进行样式提醒。详见条件格式化。 | |
数据交互 | 数据交互 | 设置是否进行数据刷新。类似于仪表板中组件的数据刷新能力。
|
布局 | 布局大小 | 设置标签的大小,可选择自动或固定尺寸。 选择固定尺寸时,需要输入标签的宽度和高度。 |
内部边距 | 设置标签边框与内容的距离。 | |
垂直偏移 | 数据标注上下偏移的距离,正数向上偏移,负数向下偏移。 | |
数据设置 | 显示维度所有内容 | 将数值为 NULL或空的维度也显示出来。 |
空值(Null)显示为 | 设置空值(Null)时显示的内容。 | |
空白(Black)显示为 | 设置空白(Black)时显示的内容。 |
点击场景设定按钮,在右侧的属性设置中设置场景。
分类 | 项目 | 说明 | 截图 |
---|---|---|---|
场景设置 | 环境背景 | 默认有一个背景,支持更换其他场景,如演播室、蓝天白云等。 也可以选择自定义背景,然后添加背景URL。 (点击https://polyhaven.com/hdris 获取免费背景) | |
环境模糊度 | 设置背景的模糊程度,最小为0.01。 | ||
地面 | 选择地面效果,可设置地面的图案、颜色、线的颜色、网格密度。 | ||
模型选中颜色 | 设置选中模型的边框颜色(仅预览时生效)。 | ||
轮播设置 | 自动轮播 | 轮播总开关,开启后预览时将轮流聚焦数据标注。 可全局设置聚焦时的高亮颜色、相机角度、距离、移动动画时间和相机停滞时间。 设置后,各个模型节点会继承该设置。但当模型节点自定义数据后,则以模型节点中的设置为准。 | |
相机 | Alpha/Beta/距离上下限 | 控制相机Alpha弧度、Beta弧度以及距离的上下限制。 Beta 上下限范围为0.01到1.57;距离的上下限范围为0到500。 | |
开启景深效果 | 是否启用相机的景深效果。 开启后可设置焦距、光圈系数和模糊半径。 | ||
常规设置 | 场景参数 | 设置场景参数,详见数据筛选和过滤。 | |
全局筛选器 | 添加全局数据过滤器,详见添加数据筛选和过滤。 | ||
语言资源 | 为场景中加载语言资源,加载后可在数据绑定区域为已绑定字段重命名时使用语言资源。 详细介绍请您参考应用语言资源。 | ||
文档外观 | 文档主题 | 设置场景文档主题。 更改主题时,字体颜色、字体大小、背景等都会受到影响。 | |
模型动画 | 动画方案 | 配置如何执行3D模型中设计的动画。需要提前向场景中添加有动画设计的模型。 显示加载模型中的动画列表并自定义开始时间和循环方法。 | |
数据交互 | 自定义编写JavaScript代码并选择执行的时机,与仪表板进行数据交互。 详见使用JS代码定制数据交互。 | ||
特效 | 粒子特效 | 向场景添加粒子效果。 | |
飞升线条 | 添加飞升l为场景添加飞升线条效果。 | ||
抗锯齿 | 启用MSAA | 是否启用MSAA方案。 | |
启用FXAA | 是否启用FXAA方案。 |
设置完成后,基本的一个3D场景就完成了,保存相机视角,并点击保存按钮保存场景。
输入场景名称,选择合适的分类,并点击确定。
在门户网站中点击可预览场景。后续为您介绍,将设计的3D场景文件应用到仪表板中。