检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
组件交互 组件自定义事件实现 组件响应动作实现 父主题： 自定义组件开发规范
重命名组件 通过重命名功能，可自定义组件的名称，便于搜索和管理。 重命名组件 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。 在编辑页面状态下，选中组件，单击右键，选择“重命名”。 图1 重命名 您也可以在“图层”中，将鼠标悬浮在组件上，单击“重命名”。
子、折线图的线条、拐点等。 图4 里程碑图形 碑节点样式 里程碑样式：设置里程碑的样式，可以使用预置样式，也可以使用图片。 节点样式：选择系统预置的里程碑样式，“里程碑样式”选择“预置”时，才会显示该参数。 选择图片：选择本地上传的图片或连接器中的图片，作为里程碑的样式。“里程碑样式”选择“图片”时，才会显示该参数。
Iframe布局框 Iframe布局框用于在大屏页面的某块区域中呈现页面，组件的页面内容基于域名分区域加载，秒级刷新，组件间互不影响，有效提升大屏可视体验。同时，组件间支持故障隔离，有效提升大屏展现可靠性。 在大屏设计页面，从“全部组件 > 其它”中，拖拽“Iframe布局框”组件至画布空白区域，如图1。
下拉选择框 下拉选择框是文本组件的一种，用于在下拉框中选择某一项内容，由一个输入框和一个下拉弹出框组成。 在大屏设计页面，从“全部组件 > 文本”中，拖拽“下拉选择框”组件至画布空白区域，如图1。 图1 下拉选择框 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理
时间轴 时间轴是文本组件的一种，用于按时间顺序来展示了一系列事件。 在大屏设计页面，从“全部组件 > 文本”中，拖拽“时间轴”组件至画布空白区域，如图1。 图1 时间轴 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡片标题、图表、卡片背景、卡片边框）和图表元素构成。
时间翻牌器 时间翻牌器是文本组件的一种，用于使用翻牌器效果动态展示当前时间。 在大屏设计页面，从“全部组件 > 文本”中，拖拽“时间翻牌器”组件至画布空白区域，如图1。 图1 时间翻牌器 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡
选项卡 选项卡是导航组件的一种，用于快速在页面某区域中切换不同内容，显示为其关联内容上方的单行元素。 在大屏设计页面，从“全部组件 > 导航”中，拖拽“选项卡”组件至画布空白区域，如图1。 图1 选项卡 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡
路由视图 路由视图是导航组件的一种，通过配置不同页面，在当前可视化页面呈现其它页面效果。该组件可降低对当前页面资源的占用，提升性能。 在大屏设计页面，从“全部组件 > 导航”中，拖拽“路由视图”组件至画布空白区域，如图1。 图1 路由视图 图2 边距样式说明 卡片 卡片是指包裹图
组件间交互 操作场景 组件间交互是指在同一页面中，不同组件之间进行的交互事件。组件和组件之间可互为触发器和响应器，根据用户所定义的事件不同，可定义组件行为、赋值全局变量以及响应自定义动作。 本章节以在同一区域中，添加多个组件，使用tab来切换不同tab页签下需要呈现的组件为例，向您介绍如何设置组件间的交互能力。
页面间交互 操作场景 页面间交互是指在不同页面中，进行的相互跳转动作。可跳转同一项目中的任一页面，或跳转外部页面。在跳转项目内部页面时，用户可设置跳转携带相关参数。 同项目不同页面之间的跳转 当项目场景较多，一屏无法完全涵盖所有内容或需要额外查询时，为了性能考虑，通常会采取传递参
图片 图片是媒体组件的一种，用于直接展示需要呈现的图片数据。 在大屏设计页面，从“全部组件 > 媒体”中，拖拽“图片”组件至画布空白区域，如图1。 图1 图片 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡片标题、图表、卡片背景、卡片边框）和图表元素构成。
FLV视频播放 FLV视频播放是媒体组件的一种，用于播放FLV（Flash Video）格式的视频。 在大屏设计页面，从“全部组件 > 媒体”中，拖拽“FLV视频播放”组件至画布空白区域，如图1。 图1 FLV视频播放 图2 边距样式说明 卡片 卡片是指包裹媒体组件的外层架构，可
文本编辑 文本编辑是文本组件的一种，用于显示多行文本，可对接数据集并设置交互。 在大屏设计页面，从“全部组件 > 文本”中，拖拽“文本编辑”组件至画布空白区域，如图1。 图1 文本编辑 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡片
分割线 分割线是装饰组件的一种，用于分割组件，起装饰作用，包括分割线和竖分割线。 以分割线16-1为例，在大屏设计页面，从“全部组件 > 装饰”中，拖拽“分割线16-1”组件至画布空白区域，如图1。 图1 分割线16-1 页面背景色设置为白色时，分割线组件很难显示出来。使用该组件时，请避免使用白色背景。
路由导航(示例) 路由导航(示例)是导航组件的一种，通过配置不同的路由页面，快速切换和定位到其它的页面中，给数据大屏提供更多的交互模式。 在大屏设计页面，从“全部组件 > 导航”中，拖拽“路由导航(示例)”组件至画布空白区域，如图1，路由视图的配置介绍，请参见路由视图。 图1 路由导航(示例)
特效：组件是否高亮显示，支持默认展示和跳转到页面时展示。 边距：组件中图表距离整个组件四边（上、下、左、右）的距离（参见图2），默认为0，即铺满整个组件。 参考模板：系统预置的组件样式模板，支持默认模板和标签模板两种样式。 边框圆角：边框的圆角，四个角弧度取值范围为0~500，单位px。 图表背景：图表的背景颜色。
特效：组件是否高亮显示，支持默认展示和跳转到页面时展示。 边距：组件中图表距离整个组件四边（上、下、左、右）的距离（参见图2），默认为0，即铺满整个组件。 参考模板：系统预置的组件样式模板，支持默认和带标签两种。 边框圆角：边框的圆角，四个角弧度取值范围为0~500，单位px。 图表背景：图表的背景颜色。
特效：组件是否高亮显示，支持默认展示和跳转到页面时展示。 边距：组件中图表距离整个组件四边（上、下、左、右）的距离（参见图2），默认为0，即铺满整个组件。 参考模板：系统预置的组件样式模板，支持默认和带标签两种。 边框圆角：边框的圆角，四个角弧度取值范围为0~500，单位px。 图表背景：图表的背景颜色。
特效：组件是否高亮显示，支持默认展示和跳转到页面时展示。 边距：组件中图表距离整个组件四边（上、下、左、右）的距离（参见图2），默认为0，即铺满整个组件。 参考模板：系统预置的折柱图模板。 图表背景：图表的背景颜色。 颜色设置：设置图表背景颜色。 圆角：图表背景是否为圆角。 圆角半径：四边圆角时的圆角半径（
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
