检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
{widget}.css 文件介绍 {widget}.css为组件的样式文件,在该文件中编写组件的CSS样式。 华为云Astro大屏应用的组件未进行打包编译,CSS样式可能存在互相影响的风险。因为,CSS选择器务必要加上组件id,通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate
boolean 是否禁用,可自定义函数,根据其他选项的值来判定是否禁用,返回true禁用。 showFunc Function 否 showFunc: function(vm) { return vm.commProps.showTitle; } 是否显示该配置项,可自定义函数,根据其他选项
eventConfig为组件事件配置项,用于定义组件事件暴露的变量结构,以及事件和对外透传变量的业务含义。eventConfig配置好后,在组件配置交互时可以将事件的itemVal传递给页面全局变量中,供其他组件使用。 典型示例 典型的eventConfig示例如下: // 组件事件配置项,定义组件事件结构及说明,给全局变量映射使用
getWidgetBasePath 获取该组件静态资源的根路径,用来拼接组件内部的其他静态资源。 getMessages 获取该组件国际化配置文件中定义的国际化文件内容,推荐配置vue和vueI18n使用。 hideWidget 隐藏组件。 showWidget 显示组件。 triggerEvent
{widget}.editor.js 文件介绍及示例 eventConfig classfication propertiesConfig 父主题: 目录文件详解
i18n.json 文件介绍 i18n.json为组件的国际化资源文件,用于配置多语言,目前支持的多语言包含中英文两种,相应的key值分别为['zh-CN','en-US']。多语言文件支持配置在多个Json中,在packageinfo.json中的配置示例如下: "i18n":
packageinfo.json 文件介绍 packageinfo.json是组件的元数据描述文件,用于配置组件的基本信息。 文件示例 { "widgetApi": [{ "name": "EchartsWidgetTemplate" }], "widgetDescription":
HttpUtils工具类预置API一览表 表1 HttpUtils工具类预置API一览表 API API说明 getCookie 用于获取某个cookie的值。 setCookie 用于设置cookie的值。 getI18n 返回一个Vue18n的实例。 getCsrfToken
magno对象预置API一览表 表1 magno对象预置API一览表 API API说明 savePropertiesForWidget() 用于在开发态中保存当前组件的高级设置属性信息。 savePropertiesForWidget() 该API用于在开发态中,保存当前组件的高级设置属性信息。
SafeUtils安全工具类预置API一览表 表1 SafeUtils安全工具类预置API一览表 API API说明 escapeHtml() 将HTML字符串进行转义。 getSafeUrl() 对外部链接进行xss安全过滤,获取安全的绝对URL地址。 escapeHtml()
”和“\\{0}”两种类型的转义字符。转义字符中的数字“0”为文本编辑组件数据中二维数组的位置,其对应关系如图7所示。如果全部设置为“{0}”,则全部显示第一个数据,如图8。 图7 转义符和二位数组对应关系(一) 图8 全部显示第一个数据 新增条件格式 在大屏设计页面,从“全部组件
数据集所使用的转换器已创建,如何创建请参见新建转换器。 华为云Astro大屏应用预置了转换器供用户直接使用,用于把调用API接口返回的数据转换成二维结构。如果使用华为云Astro大屏应用预置的转换器,则无需执行此操作。 创建ROMA连接器数据集 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。
关系型数据库数据源 使用MS SQL Server、MySQL、Oracle、GaussDB和PostgreSQL关系型数据库,作为数据源。 新建关系型数据库数据源 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。
设置桥接器预置数据。 图2 设置桥接器参数 桥接器数据类型:桥接器的数据源类型,支持“静态数据”和自定义接口“AstroZero API”。 URL:配置为自定义接口的URL。如何查看自定义接口URL,请参考查看自定义接口。“桥接器数据类型”选择“AstroZero API”时,才显示该参数。 共享
在我的库中,管理系统预置的和用户自定义的库,如添加库、查看库历史版本等。系统预置的库,只能执行查看详情、查看历史版本和下载操作。本章节的操作,均以自定义库为例。 新建自定义库 以某组件中需要使用Vue(系统预置库)以及MintUI(自定义库)为例,介绍如何上传自定义库并如何在组件中使用库。 将自定义库的相关文件打成Zip包。
我的组件 在我的组件中,管理系统预置的和自定义组件,如复制组件到其他工作空间、查看组件历史版本、删除组件等。 系统预置的组件,只能执行查看详情、查看历史版本和下载操作。本章节的操作,均以自定义组件为例。 请购买“华为云Astro大屏应用专业版”和“华为云Astro大屏应用企业版”
后台接口获取后台数据。通过华为云Astro大屏应用预置的桥接器模板,您可以自定义桥接器。自定义桥接器时,需要先下载桥接器模板,根据组件的数据结构,对桥接数据进行对接和改造。如何自定义桥接器,请参见自定义桥接器。 查看桥接器模板 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。
页面。 在大屏开发页面,从“全部组件 > 装饰”中拖拽“自定义背景框”组件到画布中,并调整大小。 图1 拖拽自定义背景框到画布中 从“全部组件 > 导航”中拖拽“选项卡”组件到“自定义背景框”中。 图2 拖拽选项卡到自定义背景框组件中 增加选项卡组件的选项卡数量,并设置选项卡名称。
重命名组件 通过重命名功能,可自定义组件的名称,便于搜索和管理。 重命名组件 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在编辑页面状态下,选中组件,单击右键,选择“重命名”。 图1 重命名 您也可以在“图层”中,将鼠标悬浮在组件上,单击“重命名”。
以自定义背景框为例,在大屏设计页面,从“全部组件 > 装饰”中,拖拽“自定义背景框”组件至画布空白区域,如图1。 图1 自定义背景框 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。 图2 自定义背景框卡片