检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
设置背景图片 图4 选择背景图 从全部组件中，分别拖拽文本编辑、水平基本柱图、基本柱图、和区域图到画布区域，布局如图6所示。 图5 拖拽文本编辑组件到画布 图6 组件布局 在页面右上角，根据需要选择所需的主题（本示例设置为经典原始，即单击“取消当前主题卡片装饰”）。 配置文本编辑组件。 选中
文件介绍 i18n.json为组件的国际化资源文件，用于配置多语言，目前支持的多语言包含中英文两种，相应的key值分别为['zh-CN','en-US']。多语言文件支持配置在多个Json中，在packageinfo.json中的配置示例如下： "i18n": [{ "name":
其他数据源 配置组件数据时，支持直接创建关系型数据库、ROMA连接器、DLI、DWS、AstroZero、AstroZero API、HTTP连接器和Prometheus数据源作为组件的数据来源。 操作场景 使用在数据集中配置的数据源前，需要提前在数据中心创建各种类型数据源，配置过程中
组件对接数据配置开关 组件的数据可来自于静态数据或通过数据集获取，以EchartsWidgetTemplate组件为例，在“{Widget}”.editor.js文件中，可配置组件接入的数据。当识别到组件propertiesConfig中存在dataSetting类型的配置项时，默认组件需要对接数据集。配置示例如下：
classfication字段代表的是当前组件需要展示哪些大的配置项分类。AstroCanvas在设计前期对分类也进行了分组，因此这个字段被扩展为双数组形式。一般默认情况下，直接在数组对象的第一个数组中配置即可。如果无配置，则所有属性展示在一个大的分类下。 classfication中的配置包含预置分类和自定义分类两种。
eventConfig为组件事件配置项，用于定义组件事件暴露的变量结构，以及事件和对外透传变量的业务含义。eventConfig配置好后，在组件配置交互时可以将事件的itemVal传递给页面全局变量中，供其他组件使用。 典型示例 典型的eventConfig示例如下： // 组件事件配置项，定义组件事件结构及说明，给全局变量映射使用
使用自定义桥接器 参考创建大屏&PC端项目中操作，创建一个项目。 项目创建后，参考使用空白画布新建页面中操作，新建一个空白页面。 进入开发页面，从“全部组件 > 图表”中，拖拽玫瑰花饼图组件到画布中。 图4 拖拽玫瑰花饼图到画布中 选中组件，单击组件上方的，进入数据设置页面。 “数据类
复制并粘贴组件 通过复制粘贴功能，可快速将组件的配置参数复制到同类型的另一个组件中，从而高效完成多个同类型组件配置项参数之间的传递。 复制并粘贴组件 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在编辑页面状态下，选中组件，单击右键，选择“复制并粘贴”。
选择“Roma连接器”，配置数据源参数。 图1 新建Roma连接器数据源 数据源名称：新建数据源的名称，用于标识该数据源。长度为1~32个字符，可包括中文、字母、数字及下划线，且不能以下划线开头或结尾。 APIC服务地址：ROMA Connect服务集成APIC的网关地址，配置该值后，可实现调用ROMA
数据集 选择在“数据中心”中配置的数据集，作为组件数据来源。选择此方式时，请确保数据集已在数据中心创建，详情请参见数据中心。 数据集 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在编辑页面状态下，选中组件，单击组件上方的。 在数据类型中，选择“数据集”。
组件对齐 选中多个组件后，单击右侧配置面板的对齐或分布图标。支持左、水平居中、右、顶、垂直居中、底等多种对齐方式，以及水平和垂直的自动分布方式。 组件对齐 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在页面编辑模式下，选择所需的组件，单击下图红框中图标，进行组件对齐。
跨页面复制组件 通过复制到功能，可快速将组件复制到其他页面，从而高效完成多个同类型组件配置项参数之间的传递。 跨页面复制组件 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在编辑页面状态下，选中一个或多个组件，单击右键，选择“复制到”，并选择组件待复制到的页面。
packageinfo.json 文件介绍 packageinfo.json是组件的元数据描述文件，用于配置组件的基本信息。 文件示例 { "widgetApi": [{ "name": "EchartsWidgetTemplate" }], "widgetDescription":
隐藏组件 通过组件隐藏功能，可以隐藏多个已部署完成的组件，使得组件过多的可视化页面变得更加清晰，操作更加流程，从而提高可视化页面的开发效率。 组件隐藏后，在开发态和预览页面时，都会隐藏该组件。 隐藏组件 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。
自定义的事件名为“sendSelect”，必须配置。 在组件“.js”文件逻辑代码中，使用“thisObj.triggerEvent()”方法触发该事件时，要将变量字段传入发送的data中。 desc 事件的中英文描述，可描述事件的具体场景、作用，必须配置。 fields 变量列表，必须配置，即事件对外输出的
{}); eventConfig：组件事件描述配置项，用来扩展给全局变量使用。 classfication：组件的配置项分类。 propertiesConfig：负责组件配置页面中，右侧的属性配置逻辑。 create（必须配置）：组件内置的扩展，仅在组件首次被创建时调用一次。
锁定/解锁组件 操作场景 通过锁定功能，锁定多个可视化页面中已配置完成的组件，使之不被随意改动。 组件锁定后，不受可视化页面布局过程中的其他操作影响。 组件锁定后，无法在画布上对组件进行任何操作，直到解锁后才能恢复。 组件锁定后，可避免组件过多引起的误操作。 锁定组件 参考登录A
自定义组件开发规范 代码结构介绍 组件配置项（Config配置） 组件内置API 组件数据接入 组件交互
发过程中，可能后台接口还未开发完成，这时可通过修改桥接器使用静态数据来进行调测。但是当组件较多时，用户逐个修改组件的桥接器配置会过于繁琐，可直接将桥接器配置为调用后台接口，在“项目设置”中打开“启用模拟数据”开关，一键开启当前项目中所有桥接器使用模拟数据，也可以在“组件”页签的组
参考线是指为图表组件添加可视化的参考标准，为图表中数据提供具体的参考依据。 组件数据来源 组件是大屏页面的组成元素，配置页面数据即为配置组件数据。选中组件，单击组件上方的，可配置组件在页面呈现数据的来源，更多介绍请参见数据接入。 图5 配置组件数据 组件交互 AstroCanvas为组件设计了事件-动作机制实现组件与
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
