检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
选项卡 选项卡是导航组件的一种,用于快速在页面某区域中切换不同内容,显示为其关联内容上方的单行元素。 在大屏设计页面,从“全部组件 > 导航”中,拖拽“选项卡”组件至画布空白区域,如图1。 图1 选项卡 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡
路由视图 路由视图是导航组件的一种,通过配置不同页面,在当前可视化页面呈现其它页面效果。该组件可降低对当前页面资源的占用,提升性能。 在大屏设计页面,从“全部组件 > 导航”中,拖拽“路由视图”组件至画布空白区域,如图1。 图1 路由视图 图2 边距样式说明 卡片 卡片是指包裹图
组件间交互 操作场景 组件间交互是指在同一页面中,不同组件之间进行的交互事件。组件和组件之间可互为触发器和响应器,根据用户所定义的事件不同,可定义组件行为、赋值全局变量以及响应自定义动作。 本章节以在同一区域中,添加多个组件,使用tab来切换不同tab页签下需要呈现的组件为例,向您介绍如何设置组件间的交互能力。
页面间交互 操作场景 页面间交互是指在不同页面中,进行的相互跳转动作。可跳转同一项目中的任一页面,或跳转外部页面。在跳转项目内部页面时,用户可设置跳转携带相关参数。 同项目不同页面之间的跳转 当项目场景较多,一屏无法完全涵盖所有内容或需要额外查询时,为了性能考虑,通常会采取传递参
散点图 散点图是气泡图的一种,通过数据点,来对数据的相关性进行描述的可视化图形。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“散点图”组件至画布空白区域,如图1。 图1 散点图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标
基本柱图 基本柱图是柱状图的一种,通过柱形图来呈现数据整体的表现。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“基本柱图”组件至画布空白区域,如图1。 图1 基本柱图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。
瀑布柱图 瀑布柱图是柱状图的一种,具有自上而下的流畅效果,在企业经营分析、财务分析中使用较多,用以表示企业成本的构成、变化等情况。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“瀑布柱图”组件至画布空白区域,如图1。 图1 瀑布柱图 图2 边距样式说明 卡片 卡片是指包裹图表
OpenLayers地图 OpenLayers地图是一个离线地图组件,可以基于OpenLayers添加各类图层。 在大屏设计页面,从“地图”中,拖拽“OpenLayers地图”组件至画布空白区域,如图1。 图1 OpenLayers地图 图2 边距样式说明 卡片 卡片是指包裹图表
基本饼图 基本饼图是饼图的最基础表现形式,即通过饼图的方式,将数据信息清晰的展示在可视化应用上。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“基本饼图”组件至画布空白区域,如图1。 图1 基本饼图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡
双向柱图 双向柱图是柱状图的一种,通过柱形图双向呈现数据的变化。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“双向柱图”组件至画布空白区域,如图1。 图1 双向柱图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。
热力图 热力图是柱状图的一种,通过对色块着色来显示数据的统计图表。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“热力图”组件至画布空白区域,如图1。 图1 热力图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。
如何进行设置页面 在大屏页面中,可以对页面进行一些基础的配置,例如屏幕大小、背景颜色及背景图片等效果的设置。 屏幕大小 页面的屏幕大小,可以使用默认的屏幕大小,也可以自定义页面的大小,以适配大屏尺寸,推荐常用尺寸1920*1080、1600*900及3840*2080等。 图1 屏幕大小
修改项目名称 项目创建后,支持修改项目名称。 修改项目名称 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在项目列表中,将鼠标放在对应的项目上,单击。 根据实际需求,修改项目的名称。 项目名称的长度为1~64个字符,可包括中文、字母、数字及下划线,但不能以下划线开头或结尾。
树状表格 树状表格是文本组件的一种,通过表格的方式,将数据信息以表格的形式清晰的展示在可视化应用上。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“树状表格”组件至画布空白区域,如图1。 图1 树状表格 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件
设置空间页面配额 空间创建后,支持为该空间设置页面配额。 调整配额 租户管理员参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 将鼠标放在页面右上方的“默认团队空间”上,选择新建工作空间中创建的工作空间,切换到目标工作空间。 在目标工作空间中,单击页面数量下方的“调整配额”。
通过参数控制响应动作 在设置组件交互动作时,可以通过选择事件参数、全局变量或固定值,明确有哪些类型的参数可以传递。 通过参数控制响应动作 参考创建大屏&PC端项目中操作,新建一个大屏项目。 参考使用空白画布新建页面中操作,新建一个空白页面,如页面一,并拖入实心圆饼图和下拉选择框。
进度条 进度条是柱状图的一种,通过进度条可实现百分比展示能力,支持电池和柱状图两种展示形式。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“进度条”组件至画布空白区域,如图1。 图1 进度条 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础
折柱图 折柱图是柱状图的一种,通过折线和柱状图相结合的方式,将数据信息以折柱图的形式清晰地展示在可视化应用上。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“折柱图”组件至画布空白区域,如图1。 图1 折柱图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解
创建大屏&PC端项目 在华为云Astro大屏应用中创建页面前,需要先创建一个项目。项目可以理解为是一种业务场景的集合,在项目中可以创建多个页面。 创建项目 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在“项目列表”中,单击“新建项目”。 在新建
基本漏斗图 基本漏斗图是柱状图的一种,使用漏斗图或梯形图来形象的展示数据排序变化。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“基本漏斗图”组件至画布空白区域,如图1。 图1 基本漏斗图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元