检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
日期选择器 日期选择器是文本组件的一种,用于在页面选择日期。日期选择器由输入框和日期弹出框组成,单击该组件的输入框,弹出日期选择框可选择具体日期。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“日期选择器”组件至画布空白区域,如图1。 图1 日期选择器 图2 边距样式说明 卡片
分割线颜色:时间弹出框中分割线的颜色。 图8 分割线颜色 前月后月的日期颜色:时间弹出框中,上个月日期和下个月日期的日期颜色。 图9 前月后月的日期颜色 数据 在数据中,设置时间选择器组件的数据来源,更多介绍请参见数据接入。 交互 在交互中,配置时间选择器组件与其他组件或页面之间的交互能力。更多交互介绍,请参见交互设置。
在配置组件交互时,可以通过编写代码实现自定义交互动作,从而实现对应的业务需求。 图1 自定义动作 自定义动作参数说明 在自定义动作中,支持直接使用的参数如下: eventParam:组件传递出的参数。 以日期选择器组件为例,介绍如何获取eventParam。 在页面中,拖入一个日期选择器组件到画布中。
css为组件的样式文件,在该文件中编写组件的CSS样式。 华为云Astro大屏应用的组件未进行打包编译,CSS样式可能存在互相影响的风险。因为,CSS选择器务必要加上组件id,通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate { height: 100
组件响应动作实现 组件除了可以作为事件的触发器,还可以处理事件的响应动作,在响应动作中选择组件响应,就可以选择对应的组件响应动作,数据刷新、获取当前输入框值等都是组件的自定义响应动作。本章节将向您介绍,如何实现组件响应动作。 注册动作 在响应动作中,单击“响应动作”,在下拉框中选择对应的响应动作。
如何通过全局变量,实现组件数据的动态变化 在华为云Astro大屏应用中,支持通过全局变量,来控制组件数据的动态显示。本章节以全局变量,控制地图组件中数据的动态显示为例进行介绍。 通过全局变量实现组件数据动态变化 参考关系型数据库数据源中操作,新建关系型数据库数据源。 图1 新建关系型数据库数据源
图4 轮播页面轮播配置 轮播设置 页面:添加轮播的页面,可以选择本项目内的页面,也可以选择外部页面,但添加的页面数不能超过10个。 滚动条:是否显示滚动条,如自动或隐藏。 切换配置 切换箭头:是否显示页面切换箭头。 切换方向:设置页面切换方向,如水平、垂直。 切换方式:设置页面切换方式,如淡出、推出、展示等。
组件自定义事件实现 组件之间的交互,主要包括组件自定义事件和组件响应动作,本章节将为您介绍组件自定义事件的实现方式。自定义事件是指组件作为触发器,当用户操作组件(比如下拉框选中选项)时发出的事件。 注册自定义事件 自定义事件在{widget}.editor.js文件中的event
状态4/5/6/7:其他状态,每种状态可对应日历上的待办事项或者重要内容等。 该状态下日期块的背景色:设置当前状态下日期块的背景颜色。 日期字体:设置该状态下日期字体、文字大小、日期文字颜色等。 日期的行高大小:设置该状态下日期的行高大小。 内容字体:设置该状态下日期上备注的内容字体、文字大小、内容文字颜色等。 日历卡片
趋势 搜索框 下拉选择框 日历组件 翻牌器 时间展示 时间翻牌器 里程碑 排行榜 天气 文本编辑 复选框 日期选择器 指标 标题 树状下拉框 多趋势 树状表格 高级表格 时间选择器 父主题: 组件介绍
如何基于页面级的全局变量实现组件交互 华为云Astro大屏应用支持设置页面级的全局变量,通过页面组件间的交互,可给全局变量赋值。本章节将以开发一个告警监控页面为例,逐步介绍如何开发一个基于全局变量的交互页面。 场景说明 开发一个告警监控页面,如图1所示,在页面上方下拉框中选择告警
排列方向:设置图例的排列方向,支持水平和垂直两种方式。 类型:存在很多图例,导致图表中无法全部显示,此时可设置图例类型,即通过滚动翻页还是普通换行来查看图例。设置为“滚动翻页”时,支持设置翻页箭头的宽高、图标默认颜色、图标选中颜色和页码字体。 图例总宽高:设置图例项的宽度和高度,单位为“%”。
如何在页面URL参数中给全局变量赋值 如何基于页面级的全局变量实现组件交互中实现的场景是:用户在“下拉选择框”中选择某个告警状态时,通过配置的交互事件将告警状态赋值给全局变量,“多区域折线图”组件呈现的数据来源于封装了华为云Astro轻应用某API接口的数据集,将该接口的入参与全
自动续费可以减少手动续费的管理成本,避免因忘记手动续费而导致华为云Astro大屏应用被自动删除。自动续费的规则如下所述: 以华为云Astro大屏应用的到期日计算第一次自动续费日期和计费周期。 华为云Astro大屏应用自动续费周期以您选择的续费时长为准。例如,您选择了3个月,华为云Astro大屏应用即在每次到期前自动续费3个月。
单位字体:设置单位的字体、大小和颜色。“单位”设置为“显示”时,才会显示该参数。 动画设置 动画类型:设置翻牌器动画类型,支持普通类型、滚动类型和翻牌类型。 动画时间:设置动画时间,取值范围为[200, 100000],单位为ms。 单次变换间隔:设置动画单次变换间隔时间,取值范围为[50
文字间距:设置文字之间的间距。 首行缩进:文本首行是否缩进,设置为0,表示不缩进。 文本滚动 滚动显示:文本是否滚动显示。 滚动方式:设置文本滚动方式,支持向上滚动、向下滚动、向左滚动和向右滚动。 滚动速度:设置文本滚动速度。 问号提示 问号提示:是否显示问号提示。 提示文本:输入问号提示的文本内容。
式。 类型:存在很多图例,导致图表中无法全部显示,此时可设置图例类型,即通过滚动翻页还是普通换行来查看图例。设置为“滚动翻页”时,支持设置翻页箭头的宽高、图标默认颜色、图标选中颜色和页码字体。 图9 滚动翻页效果 图10 普通换行效果 图例项宽度:设置图例的宽度,支持自动和自定义。
设置单行是否停顿、轮播速度和单行停顿时间。 横向滚动:是否开启横向滚动。 行配置 奇行背景色:设置奇数行数据的背景颜色。 偶行背景色:设置偶数行数据的背景颜色。 溢出文本:设置表格中超长文本的显示样式,如显示为省略号、换行显示和滚动显示。 序列号:表格中序列号设置。 是否展示:表格中是否显示序列号。
切换类型 tab 切换 switch 开关 radio 单选 checkbox 多选 颜色类型 colorpicker 颜色选择器 时间日期类型 time 时间选择器 下拉选择类型 select 下拉选择 循环类型 list 循环 config配置示例 config配置示例如下,设置后效果如图1所示。
发布项目 项目开发完成后,可以直接在线预览,也可以一键打包从A环境发布、B环境安装,实现开发 > 测试 > 上线的快速部署,从而实现不同环境之间资产的快速迁移。发布项目,支持将项目中的数据集数据一并进行打包。 前提条件 发布项目前,请确保项目中的页面已发布。 发布项目 参考登录华