场景基础配置项是用于承载地图本身和各子组件的模块,支持添加多个城市基底子组件和数据映射子组件,支持配置城市场景地图的基础属性和快速样式。本文介绍城市三维场景构建器组件场景基础配置项的含义。
添加组件并选择场景范围区域
- 单击组件栏内的 组件。
- 在选择子组件对话框中选择一个或多个城市基底子组件;您也可以单击选中对话框右上角的全选按钮,选中所有的城市基底子组件。
- 选择子组件后,单击对话框下方的下一步即可进入选择范围对话框;单击取消可以取消添加城市三维场景构建器组件。
- 单击选择范围对话框内的数据版本下拉框,选择您需要的数据版本内容。
- 单击对话框左上角城市列表,在列表已有的城市选项中,选择您想展示的三维城市选项,地图即可快速定位导航到该城市区域。
说明 城市定位后,绿色区域为可选范围,非绿色区域暂无城市数据,无法加载城市三维场景构建器场景内容。
- 单击对话框左侧的
、
号或者通过鼠标滚动缩放地图可放大或者缩小当前地图区域,按住鼠标拖动地图可移动展示区域。
- 完成城市区域地图的适当移动和缩放后,可以通过以下三种方式选择场景范围:
- 单击区域选择范围:单击选中已购买(授权)的某个区域,如果购买的为地级市行政区,单击后将下钻展示县级行政区,您可以继续单击选择该县级行政区。被选中后的区域会以蓝色显示。
图 1. 单击区域展示样式 图 2. 下钻到县级区域展示样式 - 左侧框选工具选择区域:您可以单击系统左侧提供方形、圆形和多边形三种工具进行场景范围的框选。
说明 多边形框选工具通过双击或单击已有的锚点结束框选范围的选择。
- 数据输入框选择范围区域:单击左侧
按钮打开场景范围数据输入框,您可以直接输入所需范围区域的GeoJSON格式文本,单击输入框下方确定后,地图上将展示您输入的GeoJSON范围区域。
说明 通过以上任意一种方式选择的区域范围都将在场景范围数据文本输入框中展示,您可以从输入框内获取当前选择的范围数据。 - 单击区域选择范围:单击选中已购买(授权)的某个区域,如果购买的为地级市行政区,单击后将下钻展示县级行政区,您可以继续单击选择该县级行政区。被选中后的区域会以蓝色显示。
- 您如果有算法参数配置的需求,可单击选择范围对话框右上角的高级配置,在不同的城市基底子组件参数编辑器内,修改子组件的算法参数内容。完成修改后单击确定完成参数配置。
- 单击选择范围对话框右下角的确定即可完成城市三维场景构建器组件的添加并加载组件框选的数据范围区域;单击上一步可以退回到选择子组件对话框,重新选择所需城市基底子组件;单击取消可以取消添加城市三维场景构建器组件。
配置

- 图表尺寸:包括组件的宽度和高度,单位为px。可单击
锁定组件的宽高比,等比例修改组件的宽高。再次单击进行解锁,解锁后宽高比不受限制。
- 图表位置:包括组件的横坐标和纵坐标,单位为px。横坐标为组件左上角距离页面左边界的像素距离,纵坐标为组件左上角距离页面上边界的像素距离。
- 旋转角度:以组件的中心为中心点,进行旋转,单位为度(°)。
- 手动输入角度值,控制组件的旋转角度。
- 拖动
图标内的黑点,控制组件的旋转角度。
- 单击
图标,控制组件左右翻转样式。
- 单击
图标,控制组件上下翻转样式。
- 透明度:取值范围为0~1。为0时,图表隐藏;为1时,图表全部显示。默认为1。
- 进入场景编辑器:城市三维场景构建器城市组件父容器详细的配置参数,需单击进入场景编辑器后,在场景编辑器面板中配置,详情请参见父容器配置项说明。
数据

城市三维场景构建器中城市组件父容器的详细数据配置,需通过进入场景编辑器面板后,在父容器配置面板中的数据内进行设置,详情请参见父容器配置项说明。
交互
该组件没有可以配置的交互事件。
蓝图编辑器交互配置
- 在画布编辑器页面,右键单击组件,选择导出到蓝图编辑器。
- 单击页面左上角的
图标。
- 在蓝图编辑器配置页面,单击导入节点栏内的城市三维场景构建器组件,在画布中可以看到如下图所示的城市三维场景构建器组件的蓝图编辑器配置参数。
- 事件
事件 说明 场景加载完成 场景加载完成,不需要抛出数据。 - 动作
参数 说明 更新右侧面板配置 更新右侧面板配置,不需要参数。 更新组件配置 更新组件配置,不需要参数。 画布大小改变 画布大小改变,不需要参数。 组件销毁 组件销毁,不需要参数。 显示 显示组件,参数示例如下所示。 { "animation": { // 动画方式,可选fade,不填无动画。 "animationType": "", // 显示延时,单位为ms。 "animationDuration": 1000, // 显示动画函数,可选linear|easeInOutQuad|easeInOutExpo。 "animationEasing": "linear" } }
隐藏 隐藏组件,参数示例如下所示。 { "animation": { // 动画方式,可选fade,不填无动画。 "animationType": "", // 显示延时,单位为ms。 "animationDuration": 1000, // 显示动画函数,可选linear|easeInOutQuad|easeInOutExpo。 "animationEasing": "linear" } }
切换显隐状态 切换组件显示或者隐藏。参数示例如下所示。 { // 显示为true,隐藏为false。 "status": true, // 显示动画。 "animationIn": { // 动画方式,可选fade,不填无动画。 "animationType": "fade", // 显示延时,单位为ms。 "animationDuration": 1000, // 显示动画函数,可选linear|easeInOutQuad|easeInOutExpo。 "animationEasing": "linear" }, // 隐藏动画。 "animationOut": { // 动画方式,可选fade,不填无动画。 "animationType": "fade", // 隐藏延时,单位为ms。 "animationDuration": 1000, // 隐藏动画函数,可选linear|easeInOutQuad|easeInOutExpo。 "animationEasing": "linear" } }
移动 将组件移动到指定位置。参数示例如下所示。 { // 移动方式。绝对定位:to,相对定位:by。默认值:to。 "positionType": "to", // 指定位置。x坐标,y坐标。 "attr": { "x": 0, "y": 0 }, // 动画方式。 "animation": { "enable": false, // 动画延时。 "animationDuration": 1000, // 动画曲线。可选值为:linear|easeInOutQuad|easeInOutExpo。 "animationEasing": "linear" } }
- 事件
在文档使用中是否遇到以下问题
更多建议
匿名提交