检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
组件间交互是指在同一页面中,不同组件之间进行的交互事件。组件和组件之间可互为触发器和响应器,根据用户所定义的事件不同,可定义组件行为、赋值全局变量以及响应自定义动作。 本章节以在同一区域中,添加多个组件,使用tab来切换不同tab页签下需要呈现的组件为例,向您介绍如何设置组件间的交互能力。 组件间交互
账单管理”查看资源的费用账单,以了解该资源在某个时间段的使用量和计费信息。 账单上报周期 包年/包月计费模式的资源完成支付后,会实时上报一条账单到计费系统进行结算。 查看指定资源的账单 登录管理控制台。 在主菜单中,单击“费用”。 在左侧导航栏中,选择“订单管理 > 我的订单”,进入“我的订单”页面。
对外部链接进行xss安全过滤,获取安全的绝对URL地址。 escapeHtml() 对HTML字符串进行转义,获取转义后的字符串供页面显示用,使用方式参考如下: /* * @param {*} text */ SafeUtils.escapeHtml(text) // 方法返回转义后的字符串 例如输入字符串如下:
筛选组件 在图层中,支持按组件名称、组件标题和组件类型进行筛选,帮助您更加高效的选择所需要的组件。 筛选组件 参考创建页面中操作,创建所需的页面。 选择“图层”,进入图层页面。 在图层中,单击,筛选组件。 图1 筛选组件 父主题: 图层管理
卡片装饰:卡片装饰设置,可根据自身的业务需求选择不同的卡片样式。单击“清除样式”,可清除已设置的装饰样式。 标题:是否显示组件的标题(如图3中的关键事件)。设置为“显示”时,可自定义标题的如下属性。 内容:组件标题显示的文字内容。 字体:设置组件标题的字体样式、大小和颜色等。 对齐:标题相对于组件的对齐方式,如左对齐、居中和右对齐。
标题 标题是文本组件的一种,用于展示大屏的各类标题,可展现大、中、小等类型的标题,并可通过拼搭进行组合使用。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“标题”组件至画布空白区域,如图1。 图1 标题 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件
图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图6 排行榜图形 统一配置 对齐方式:设置组件的对齐方式,如水平居中、居左和居右。 字体:设置组件的字体、大小和颜色等。 评星大小:设置评星显示星星的大小号。 数据系列 原数据名
显示图表标题 图形 图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图9 实心圆饼图图形 颜色:设置图表中,图形的颜色。 统一配置 数据系列:是否显示该系列数据。如果不选中,会隐藏该组件中对应的系列数据。 南丁格尔图:是否使用南丁格尔图。
卡片装饰:卡片装饰设置,可根据自身的业务需求选择不同的卡片样式。单击“清除样式”,可清除已设置的装饰样式。 标题:是否显示组件的标题(如图3中的服务采购)。设置为“显示”时,可自定义标题的如下属性。 内容:组件标题显示的文字内容。 字体:设置组件标题的字体样式、大小和颜色等。 对齐:标题相对于组件的对齐方式,如左对齐、居中和右对齐。
classfication字段代表的是当前组件需要展示哪些大的配置项分类。AstroCanvas在设计前期对分类也进行了分组,因此这个字段被扩展为双数组形式。一般默认情况下,直接在数组对象的第一个数组中配置即可。如果无配置,则所有属性展示在一个大的分类下。 classfication中的配置包含预置分类和自定义分类两种。
“数据类型”选中“数据集”,并选择所需的数据集。 在全局变量配置中,绑定8中的全局变量,并给全局变量赋值。 图5 绑定全局变量 在组件预览中,从“表格字段”中拖拽对应的字段到“配置”中,并单击“保存”。 返回大屏设计页面,单击,再单击。 在预览页面,单击折线图堆叠图表中的系列,页面的全局变量将被设置为参数seriesIndex的值。
json 文件介绍 i18n.json为组件的国际化资源文件,用于配置多语言,目前支持的多语言包含中英文两种,相应的key值分别为['zh-CN','en-US']。多语言文件支持配置在多个Json中,在packageinfo.json中的配置示例如下: "i18n": [{ "name":
复制并粘贴组件 通过复制粘贴功能,可快速将组件的配置参数复制到同类型的另一个组件中,从而高效完成多个同类型组件配置项参数之间的传递。 复制并粘贴组件 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在编辑页面状态下,选中组件,单击右键,选择“复制并粘贴”。
桥接器预置 通过桥接器动态调用后台的接口,来获取后台数据展示在页面上,支持使用系统预置的桥接器或自定义桥接器。 预置桥接器 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在编辑页面状态下,选中组件,单击组件上方的。 图1 单击数据 在数据类型中,选择“桥接器预置”,并选中所需的桥接器。
如何在数据集或跳转事件动作中设置变量 在组件的数据集或组件的跳转事件动作中,是支持设置变量的。 在数据集或事件动作中设置变量 在大屏编辑页面上方,单击,新建并设置页面级全局变量。 例如,新增全局变量“url”,设置变量说明为“数据详情页面URL”。 图1 新增全局变量 从“全部组件
每一个工作空间,都对应一个新的AstroCanvas。通过创建工作空间,可实现对租户下的资源进行隔离与授权。 项目 在AstroCanvas中创建页面前,需要先创建一个项目。项目可以理解为是一种业务场景的集合,在项目中可以创建多个页面。 组件 组件(即Widget)是可复用的大屏或移动端页面
保存页面。 图4 拖入其他组件 单击页面上方的,单击“+新建版本”,会生成第二个版本。 生成的第二个版本会显示在上方,由于发布页设置的是第一个版本的页面,这时用户通过发布后的链接访问页面,页面仍是第一个版本,不会看到第二个版本新建的折线图组件。 图5 新建第二个版本 父主题: 页面管理
桥接器为连接前台页面和后台数据的连接器。在进行前台页面开发时,经常要调用后台数据,例如购物车中用户的ID,订单编号,商品信息等,这时需要通过桥接器动态调用后台接口获取后台数据。通过AstroCanvas预置的桥接器模板,您可以自定义桥接器。自定义桥接器时,需要先下载桥接器模板,根据组件的数据结构,对
数据集创建后,可复制数据集的链接分享给工作空间内的其它用户,其它用户可查看或修改数据集。 分享数据集 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据集 > 全部”。 在数据集管理页面,单击待分享数据集中的,选择“分享”。
右边距:散点图到组件边框右侧的距离。 下边距:散点图到组件边框底部的距离。 左边距:散点图到组件边框左侧的距离。 图形 图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图5 散点图图形 颜色:设置图表中图形的颜色。 统一配置 标记