检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
boolean 是否禁用,可自定义函数,根据其他选项的值来判定是否禁用,返回true禁用。 showFunc Function 否 showFunc: function(vm) { return vm.commProps.showTitle; } 是否显示该配置项,可自定义函数,根据其他选项
boolean 是否禁用,可自定义函数,根据其他选项的值来判定是否禁用,返回true禁用。 showFunc Function 否 showFunc: function(vm) { return vm.commProps.showTitle; } 是否显示该配置项,可自定义函数,根据其他选项
boolean 是否禁用,可自定义函数,根据其他选项的值来判定是否禁用,返回true禁用。 showFunc Function 否 showFunc: function(vm) { return vm.commProps.showTitle; } 是否显示该配置项,可自定义函数,根据其他选项
boolean 是否禁用,可自定义函数,根据其他选项的值来判定是否禁用,返回true禁用。 showFunc Function 否 showFunc: function(vm) { return vm.commProps.showTitle; } 是否显示该配置项,可自定义函数,根据其他选项
组件除了可以作为事件的触发器,还可以处理事件的响应动作,在响应动作中选择组件响应,就可以选择对应的组件响应动作,数据刷新、获取当前输入框值等都是组件的自定义响应动作。本章节将向您介绍,如何实现组件响应动作。 注册动作 在响应动作中,单击“响应动作”,在下拉框中选择对应的响应动作。 图1 响应动作
boolean 是否禁用,可自定义函数,根据其他选项的值来判定是否禁用,返回true禁用。 showFunc Function 否 showFunc: function(vm) { return vm.commProps.showTitle; } 是否显示该配置项,可自定义函数,根据其他选项
已预置了静态数据,您也可以自定义静态数据。 静态数据 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在编辑页面状态下,选中组件,单击组件上方的。 在数据类型中,选择“静态数据”。 图1 选择静态数据 根据业务需求自定义静态数据,也可直接使用系统预置的数据,单击“保存”。
设置桥接器预置数据。 图2 设置桥接器参数 桥接器数据类型:桥接器的数据源类型,支持“静态数据”和自定义接口“AstroZero API”。 URL:配置为自定义接口的URL。如何查看自定义接口URL,请参考查看自定义接口。“桥接器数据类型”选择“AstroZero API”时,才显示该参数。 共享
文件介绍及示例 文件介绍 {widget}.editor.js为组件属性定义文件,负责组件编辑状态时需要渲染的界面和逻辑。其中,“{widget}”为自定义组件的名称,如本示例中该文件名为“EchartsWidgetTemplate.editor.js”。{widget}.editor
添加组件 在华为云Astro大屏应用中,组件是大屏、移动端页面的组成元素。华为云Astro大屏应用提供了一些预置组件供您使用,同时支持自定义组件并上传到华为云Astro大屏应用中使用。 添加组件 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在页
连接器名称:输入新建连接器的名称,长度为1~32个字符,可包括中文、字母、数字及下划线。 类型:选择连接器类型,便于管理连接器。单击“新建类型”,可自定义连接器类型。 上传图标:单击“+”,可设置连接器显示的图标。 描述:新建连接器的描述信息,可按需进行设置。 请求协议:设置连接器请求协议。
getWidgetBasePath 获取该组件静态资源的根路径,用来拼接组件内部的其他静态资源。 getMessages 获取该组件国际化配置文件中定义的国际化文件内容,推荐配置vue和vueI18n使用。 hideWidget 隐藏组件。 showWidget 显示组件。 triggerEvent
自定义组件开发规范 代码结构介绍 组件配置项(Config配置) 组件内置API 组件数据接入 组件交互
在大屏页面中,可以对页面进行一些基础的配置,例如屏幕大小、背景颜色及背景图片等效果的设置。 屏幕大小 页面的屏幕大小,可以使用默认的屏幕大小,也可以自定义页面的大小,以适配大屏尺寸,推荐常用尺寸1920*1080、1600*900及3840*2080等。 图1 屏幕大小 开启网格 开启画布网
颜色设置:设置图层的颜色,单击“新增颜色设置”,可添加新的颜色。 最大值:热力值的最大值,默认为数据中的最大值,也可以自定义设置,会控制热力的最热区域的显示效果。 最小值:热力值的最小值,默认为数据中的最小值,也可以自定义设置,会控制热力的最冷区域的显示效果。 半径:设置热力的聚合半径。 模糊半径:热力图在渲染过程中,用于控制热力图的模糊效果。
自定义组件说明 新建并开发自定义组件 上传自定义组件 父主题: 组件管理
显示图表标题:是否显示图表标题,默认为隐藏。 标题获取:设置标题获取方式,支持自定义和从系列名获取。 标题内容:“标题获取”设置为“自定义”时,可自定义标题的内容。 标题位置(上%):设置标题距离组件上边界的距离。 标题位置(左%):“标题获取”设置为“自定义”时,支持设置标题距离组件左边界的距离。 字体:设置标题字体、大小和颜色。
件与页面之间的交互。在组件的交互响应事件中,可通过“页面跳转”响应动作传递页面参数。当跳转页面时,当前页面参数会传入到打开的页面中,支持自定义传参为固定值,也可绑定页面级全局变量。 例如,在如何基于页面级的全局变量实现组件交互开发的页面中,在“多区域折线图”组件上方单击,配置组件
即为配置组件数据。在华为云Astro大屏应用中,页面组件的数据来源包括非数据源(包括桥接器预置、静态数据和数据集等)和数据源(包括关系型数据库、Roma连接器、AstroZero和HTTP连接器等)。选中组件,单击组件上方的,即可配置组件在页面呈现数据的来源。 图1 为组件配置数据
组件交互 组件自定义事件实现 组件响应动作实现 父主题: 自定义组件开发规范