检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
已在数据中心创建，详情请参见数据中心。 数据集 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中组件，单击组件上方的。 在数据类型中，选择“数据集”。 图1 选择数据集 按需选择对应的数据集，更多操作请参见数据集管理。 父主题：
类型组件配置项参数之间的传递。 跨页面复制组件 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中一个或多个组件，单击右键，选择“复制到”，并选择组件待复制到的页面。 图1 复制组件到其他页面 您也可以在“图层”中，选中一个或多个组件，单击“复制到”。
现。 registerAction 用来注册动作，只有通过此API注册后的事件才会在组件的动作列表中展现。 inReader 判断当前页面状态是开发态或预览态。 registerWidget 必须在{widget}.editor.js中注册组件，使用方式参考如下： /* @param
复制项目版本 项目创建完成后，支持将项目中发布的版本复制到其他工作空间。 复制项目版本 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在项目列表中，将鼠标放在对应的项目上，单击。 选择对应的工作空间和项目版本，单击“确定”。 图1 选择工作空间和项目版本
组件间交互 操作场景 组件间交互是指在同一页面中，不同组件之间进行的交互事件。组件和组件之间可互为触发器和响应器，根据用户所定义的事件不同，可定义组件行为、赋值全局变量以及响应自定义动作。 本章节以在同一区域中，添加多个组件，使用tab来切换不同tab页签下需要呈现的组件为例，向您介绍如何设置组件间的交互能力。
组件隐藏后，在开发态和预览页面时，都会隐藏该组件。 隐藏组件 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中组件，单击右键，选择“隐藏”，可隐藏该组件。 图1 隐藏组件 您也可以在“图层”中，将鼠标悬浮在组件上，单击，隐藏组件。 图2 在图层中隐藏组件
想，如图1所示。 图1 移动端页面效果 图1中移动端页面，由下列组件拼装而成。 表1 组件说明 组件 说明 水平基本柱图 分状态进行告警处理情况统计，状态分：待派单、已派单、处理中、已关闭 基本折线图 统计告警处理平均时长 开发移动端页面 登录华为云Astro大屏应用服务控制台，
将组件保存为卡片，方便后期有需要时，随时调用“我的卡片”中的组件。 将组件保存为卡片 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中组件，单击右键，选择“保存为卡片”。 图1 选择保存为卡片 您也可以在“图层”中，将鼠标悬浮在组件上，单击“保存为卡片”。 图2 在图层中将组件保存为卡片
{widget}.css 文件介绍 {widget}.css为组件的样式文件，在该文件中编写组件的CSS样式。 华为云Astro大屏应用的组件未进行打包编译，CSS样式可能存在互相影响的风险。因为，CSS选择器务必要加上组件id，通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate
了静态数据，您也可以自定义静态数据。 静态数据 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中组件，单击组件上方的。 在数据类型中，选择“静态数据”。 图1 选择静态数据 根据业务需求自定义静态数据，也可直接使用系统预置的数据，单击“保存”。
用系统预置的桥接器或自定义桥接器。 预置桥接器 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中组件，单击组件上方的。 图1 单击数据 在数据类型中，选择“桥接器预置”，并选中所需的桥接器。 设置桥接器预置数据。 图2 设置桥接器参数
JS，在组件编辑状态和页面最终的发布运行态都会被加载执行。主要包含的预置API说明请参见表3。 EchartsWidgetTemplate.editor.js 组件属性定义文件，负责组件在编辑状态时需要渲染的界面和逻辑。“*.editor.js”只在组件编辑状态被加载，主要包含：
echarts组件自定义事件交互设置 echarts组件作为触发器的事件时，可以在自定义事件中设置。 自定义事件交互设置 在大屏设计页面，从Echarts图表中拖拽一个折线图堆叠组件到画布中。 图1 拖拽折线图堆叠组件到画布中 选中折线图堆叠组件，单击。 在自定义事件中，单击“新
在配置中，设置搜索框和搜索按钮。 图4 搜索框配置 搜索框设置 字体：搜索内容的字体大小、颜色等设置。 背景颜色：设置搜索框的背景颜色。 边框颜色：默认状态下，搜索框边框的颜色。 边框聚焦颜色：鼠标选中搜索框时，边框的颜色。 边框悬浮颜色：鼠标悬浮在搜索框上时，边框的颜色。 占位符：没有输入搜索内容时，展示的文字内容。
上传自定义组件 将自定义组件上传到AstroCanvas中，并在页面中使用。 上传自定义组件 参考登录华为云Astro大屏应用界面中操作，登录AstroCanvas界面。 在主菜单中，选择“我的资产”，进入我的资产页面。 在左侧导航栏中，选择“我的组件”，单击“添加组件”，进入添加组件页面。
组件自定义事件实现 组件之间的交互，主要包括组件自定义事件和组件响应动作，本章节将为您介绍组件自定义事件的实现方式。自定义事件是指组件作为触发器，当用户操作组件（比如下拉框选中选项）时发出的事件。 注册自定义事件 自定义事件在{widget}.editor.js文件中的event
如何在数据集或跳转事件动作中设置变量 在组件的数据集或组件的跳转事件动作中，是支持设置变量的。 在数据集或事件动作中设置变量 在大屏编辑页面上方，单击，新建并设置页面级全局变量。 例如，新增全局变量“url”，设置变量说明为“数据详情页面URL”。 图1 新增全局变量 从“全部组件
通过参数控制响应动作 在设置组件交互动作时，可以通过选择事件参数、全局变量或固定值，明确有哪些类型的参数可以传递。 通过参数控制响应动作 参考创建大屏&PC端项目中操作，新建一个大屏项目。 参考使用空白画布新建页面中操作，新建一个空白页面，如页面一，并拖入实心圆饼图和下拉选择框。
组件响应动作实现 组件除了可以作为事件的触发器，还可以处理事件的响应动作，在响应动作中选择组件响应，就可以选择对应的组件响应动作，数据刷新、获取当前输入框值等都是组件的自定义响应动作。本章节将向您介绍，如何实现组件响应动作。 注册动作 在响应动作中，单击“响应动作”，在下拉框中选择对应的响应动作。
通用设置 在通用设置中，可以设置网页图标、开启页面加载动画等功能。 项目通用设置 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在华为云Astro大屏应用界面的项目列表中，单击已创建的项目，进入项目。 在主菜单中，选择“项目设置”，进入项目设置页面。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
