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