检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
在画布中,拖入地图组件和下拉选择框组件。 配置地图组件。 选中组件,单击组件上方的,设置组件数据来源。 在全局变量中,选择3中创建的全局变量hotSelect。 图4 选择全局变量hotSelect 在组件预览中,从表格字段中,拖拽对应的字段到配置中。 设置完成后,单击“保存”。 选择
在“组件”页签中,拖拽所需的组件到画布中。 选中组件,单击组件上方的,进入组件数据设置页面。 在“数据类型”中,选择数据源类型,并选择数据源。 在“数据配置”下方,单击“+”,选择“转换器”。 选中转换器,此时页面会出现一个图标。 单击图标,即可进入盘古助手。 图3 在组件数据中调出盘古助手 父主题:
边距:组件中图表距离整个组件四边(上、下、左、右,如图2)的距离,默认为0,即铺满整个组件。 配置 在配置中,设置地图组件的基本信息、热力图层、柱状图层和标签图层等。 图4 地图配置 地图基本配置 地图类型:地图第三方服务商,如天地图、高德地图和百度地图。 高德/百度/天地图密钥:地图第三方密钥,请自行到对应官网申请。
复制项目版本 项目创建完成后,支持将项目中发布的版本复制到其他工作空间。 复制项目版本 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在项目列表中,将鼠标放在对应的项目上,单击。 选择对应的工作空间和项目版本,单击“确定”。 图1 选择工作空间和项目版本
组件间交互 操作场景 组件间交互是指在同一页面中,不同组件之间进行的交互事件。组件和组件之间可互为触发器和响应器,根据用户所定义的事件不同,可定义组件行为、赋值全局变量以及响应自定义动作。 本章节以在同一区域中,添加多个组件,使用tab来切换不同tab页签下需要呈现的组件为例,向您介绍如何设置组件间的交互能力。
组件对齐 选中多个组件后,单击右侧配置面板的对齐或分布图标。支持左、水平居中、右、顶、垂直居中、底等多种对齐方式,以及水平和垂直的自动分布方式。 组件对齐 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在页面编辑模式下,选择所需的组件,单击下图红框中图标,进行组件对齐。
边距:组件中图表距离整个组件四边(上、下、左、右,如图2)的距离,默认为0,即铺满整个组件。 配置 在配置中,设置组件的页签样式、导航页签和默认路由。 图4 路由导航(示例)配置 页签样式统一配置 页签方向:设置页签的显示方向,如水平方向、垂直方向。 位置:设置页签的位置,支持默认和自定义两种方式。
数据集 选择在“数据中心”中配置的数据集,作为组件数据来源。选择此方式时,请确保数据集已在数据中心创建,详情请参见数据中心。 数据集 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在编辑页面状态下,选中组件,单击组件上方的。 在数据类型中,选择“数据集”。
查看渲染效果 数据 在数据中,配置ECharts组件的数据来源,更多介绍请参见数据接入。 与其他组件不同的是,ECharts组件在数据配置流程中没有字段映射,而是直接改变实例化代码块的内容。 图11 设置ECharts图表组件数据源 将左侧表格字段拖拽到右侧配置中的代码块高亮处,如图1
{widget}.css 文件介绍 {widget}.css为组件的样式文件,在该文件中编写组件的CSS样式。 华为云Astro大屏应用的组件未进行打包编译,CSS样式可能存在互相影响的风险。因为,CSS选择器务必要加上组件id,通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate
大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。 在数据源管理页面,单击“新建数据源”。 选择“DWS”,配置数据源参数。 图1 新建DWS数据源 数据源名称:数据源的名称,用于标识该数据源。长度为1~32个字符,可包括中文、字母、数字及下划线,且不能以下划线开头或结尾。
跨页面复制组件 通过复制到功能,可快速将组件复制到其他页面,从而高效完成多个同类型组件配置项参数之间的传递。 跨页面复制组件 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在编辑页面状态下,选中一个或多个组件,单击右键,选择“复制到”,并选择组件待复制到的页面。
集,以保证数据的复用。页面级数据集主要是为了支持多个组件对接同一个数据源的情况,可以减少重复的请求跟重复的配置。 页面设置 华为云Astro大屏应用可视化开发页面,支持配置页面屏幕大小、适应方式、背景颜色或背景图片等,更多介绍请参见如何进行设置页面。 图2 页面设置 全局变量设置
地图样式:在下拉框中选择地图的样式,如“控件+标签图层”、默认样式、“地图行政区+图标图层”等。 配置 在配置中,设置地图组件的基本信息、地图样式、地图控件和地图控制等。 图4 高德地图配置 地图基本配置 地图密钥:输入地图的服务密钥,请参考高德开放平台中操作自行到官网申请。 安全密钥:如果
预置多种团队空间角色,预置管理员、开发者、数据分析师、数据工程师和访问者。 丰富组件轻松配置样式,快捷配置灵活实现布局 功能介绍 预置400+各类组件,配合自定义组件能力,实现用户多样数据可视化诉求。快捷配置帮助用户轻松调整布局。 特性优势 丰富的组件:各类图表、地图、视频、二三维引擎、
标题行高度:设置标题的行高,单位px。 背景色:设置标题背景的颜色。 文本位置:设置标题文本位置。 字体:设置标题的字体、大小和颜色等。 配置 在配置中,设置组件的全局样式、表头、行和序列号。 图4 排行榜配置 全局样式 排行榜行数:设置排行榜的行数。 背景色:设置排行榜背景的颜色。 自动轮播:是否开启自动轮播功
华为云Astro大屏应用专业版:除了具备基础版本的能力,还提供了高阶组件、自定义组件能力,高度还原设计稿大屏。 华为云Astro大屏应用企业版:适用于3D场景开发,支持私有化部署。 变更实例 表2 变更实例约束与限制 限制项 约束与限制 变更华为云Astro大屏应用实例规格 仅支持从低规格套餐升级到高规格套餐,不支持降级。
packageinfo.json 文件介绍 packageinfo.json是组件的元数据描述文件,用于配置组件的基本信息。 文件示例 { "widgetApi": [{ "name": "EchartsWidgetTemplate" }], "widgetDescription":
数据源:选择DLI数据源中,创建的数据源。 目录:设置数据集的存放目录,配置为(可选)新建目录中新建的目录,也可以直接单击“新增目录”,新建一个目录。 责任人:数据集的创建人。 描述:新建数据集的描述信息,通常设置为数据集的功能。 配置数据集参数。 标签:SQL作业的标签。单击“标签”后的“展
在大屏开发页面,单击页面上方的,保存页面。 保存成功后,单击页面上方的,进行页面发布设置。 打开发布链接。 图1 打开页面发布链接 在访问限制中,配置内容安全策略。 例如,将A市交通管理大屏嵌入第三方系统,如图2所示。 图2 安全策略设置样例 其中,“frame-ancestors”为固