检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
单击,在查找框中搜索“Astro轻应用”,单击查找到的结果,进入AstroZero服务控制台。 在主页中,单击“进入首页”,进入AstroZero应用开发页面。 单击主页中的“业务大屏”,或者左侧导航栏中的“业务大屏”,进入业务大屏界面。 图1 单击业务大屏 单击待导出项目上的,进入项目发布页面。
操作场景 项目发布后,在项目发布的版本管理中,可下载对应版本的项目包。 在AstroCanvas中导出项目时,项目包中包含的数据源密码会被置空。 操作步骤 在AstroCanvas界面的“项目列表”页面,单击待下载项目上的。 在版本管理中,鼠标放在对应版本后的“操作”下,单击。 图1
如何在页面URL参数中给全局变量赋值 如何基于页面级的全局变量实现组件交互中实现的场景是:用户在“下拉选择框”中选择某个告警状态时,通过配置的交互事件将告警状态赋值给全局变量,“多区域折线图”组件呈现的数据来源于封装了AstroZero某API接口的数据集,将该接口的入参与全局变
如何在数据集或跳转事件动作中设置变量 在组件的数据集或组件的跳转事件动作中,是支持设置变量的。 操作步骤 在大屏编辑页面上方,单击,新建并设置页面级全局变量。 例如,新增全局变量“url”,设置变量说明为“数据详情页面URL”。 图1 新增全局变量 从“全部组件 > 图表”中,拖拽“基本柱图”组件至画布空白区域。
数据接入的SQL语句中,需要添加4中创建的全局变量offset和pageSize,来限制每次获取的数据。 图5 输入SQL语句 图6 输入“$”添加全局变量 在组件预览中,将表格中的字段,拖拽到对应的配置中。 数据中的total字段,必须添加到“数据总数”中。 图7 拖拽字段到对应配置中 单击“保存”,完成组件数据源的配置。
选择所需的数据类型。 在全局变量配置下方,单击,选择转换器,添加2创建的转换器。 图5 添加转换器 在组件预览中,将表格中的字段,拖拽到对应的配置中。 图6 拖拽字段到对应配置中 单击“保存”,完成组件数据源的配置。 保存页面,预览效果。 图7 查看后台筛选效果 父主题: AstroCanvas学堂
选择所需的数据类型。 在全局变量配置下方,单击,选择转换器,添加2创建的转换器。 图5 添加转换器 在组件预览中,将表格中的字段,拖拽到对应的配置中。 图6 拖拽字段到对应配置中 单击“保存”,完成组件数据源的配置。 保存页面,预览效果。 图7 查看后台排序效果 父主题: AstroCanvas学堂
在预览表格时会显示下图中的图标,用于对表格中的数据进行排序。 图16 开启后台排序 后台筛选:是否开启后台筛选功能。开启后,在预览表格时会显示下图中的图标,用于对表格中的数据进行筛选。 图17 开启后台筛选 列宽占比(%):设置对应系列在图表中的占比。 表头对齐方式:设置表头的对齐方式,如居中、左对齐等。
边框:设置表格的边框样式。 表头设置 溢出文本:设置表格中超长文本的显示样式,如显示为省略号和换行显示。 表头对齐方式:设置表头的对齐方式,如左对齐、居中或右对齐。 表头行高占比(%):设置表头行高的占比。 表头背景色:设置表头的背景颜色,所有列的表头背景色同步修改。 表头字体:设置表头字体,所有列的表头字体同步修改。
如何自定义库 操作场景 以某组件中需要使用Vue(系统预置库)以及MintUI(自定义库)为例,介绍如何上传自定义库并如何在组件中使用库。 操作步骤 将自定义库的相关文件打成Zip包。 例如,在MintUI官网下载组件库的代码,增加一个packageinfo.json元数据描述文
边框:设置表格的边框样式。 表头设置 溢出文本:设置表格中超长文本的显示样式,如显示为省略号和换行显示。 表头对齐方式:设置表头的对齐方式,如左对齐、居中或右对齐。 表头行高占比(%):设置表头行高的占比。 表头背景色:设置表头的背景颜色,所有列的表头背景色同步修改。 表头字体:设置表头字体,所有列的表头字体同步修改。
了解更多常见问题、案例和解决方案 热门案例 如何基于页面级的全局变量实现组件交互? 自定义组件时,如何设置交互事件的输出变量? 如何在数据集或跳转事件动作中设置变量? 如何通过全局变量,实现组件数据的动态变化? 如何使用高级表格的后台分页功能? 如何使用高级表格的后台排序功能? 如何使用高级表格的后台筛选功能?
m。 在页面中,拖入一个日期选择器组件到画布中。 图2 拖拽日期选择器到画布中 选中日期选择器,单击,进入交互设置页面。 按照下图,设置自定义动作。 图3 设置自定义动作 /* * 可以像示例这样获取到组件对象,然后编写js代码 * 示例中表示,触发当前事件后,会隐藏组件widget16
如何设置页面间参数传递 AstroCanvas开发中,可通过设置组件的事件和动作属性来实现组件与组件、组件与页面之间的交互。在组件的交互响应事件中,可通过“页面跳转”响应动作传递页面参数。当跳转页面时,当前页面参数会传入到打开的页面中,支持自定义传参为固定值,也可绑定页面级全局变量。
如何设置Token认证 操作场景 在AstroCanvas中,通过设置Token认证,可以对大屏交互时传递的参数进行签名鉴权,保证大屏的URL访问链接的参数不能被篡改,从而提高大屏数据以及用户信息的安全性。使用Token签名验证功能需具备的条件及背景介绍,请参见AstroCanvas分享页Token签名校验使用说明。
如何设置分享码 操作场景 AstroCanvas支持设置页面分享码,设置后,需要校验分享码才可正常访问页面,以提高安全性。 操作步骤 进入已开发好的页面。 在页面工具栏中,单击,保存页面。 保存成功后,单击,打开“发布链接”开关。 图1 打开发布链接(新建项目) 图2 打开发布链接(已有项目)
如何进行版本回退 操作场景 开发者开发某个大屏页面时,希望回退到历史某个页面版本进行编辑。 操作步骤 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在项目列表的所有项目中,单击页面所在的项目,进入项目。 在所有页面中,单击对应的页面,单击“编辑页面”,进入大屏开发页面。
保存成功后,单击,预览效果是否符合预期。 选择下拉框数据为“已派单”、“处理中”或者“已关闭”,发现多区域折线图数据进行实时更新变化,符合预期。 扩展知识 如何设置页面间参数传递 自定义组件时,如何设置交互事件的输出变量 如何在页面URL参数中给全局变量赋值 父主题: AstroCanvas学堂
如何切换AstroCanvas平台主题颜色 操作场景 AstroCanvas支持切换平台主题颜色,以便于用户可以按照自己喜欢的界面风格进行设置。 操作步骤 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在AstroCanvas页面,单击页面右上方“账户名”后的。
域名”为大屏待嵌入的第三方系统的域名。除了上述场景外,还有一种典型的场景是将大屏嵌入本地的file中,如图4。 图4 将大屏嵌入本地的file中 登录第三方系统,在Elements中,增加“<iframe src="URL" ></iframe>”。 图5 增加大屏访问地址 其中