检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
时间选择器 时间选择器是文本组件的一种,用于选择时间。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“时间选择器”组件至画布空白区域,如图1。 图1 时间选择器 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。
新建连接器 操作场景 在华为云Astro大屏应用中,通过新建HTTP连接器,可引入第三方的API作为组件的数据来源。 图1 在组件中有引入连接器流程 新建连接器 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“连接器”。
日期选择器 日期选择器是文本组件的一种,用于在页面选择日期。日期选择器由输入框和日期弹出框组成,单击该组件的输入框,弹出日期选择框可选择具体日期。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“日期选择器”组件至画布空白区域,如图1。 图1 日期选择器 图2 边距样式说明 卡片
删除连接器 连接器删除后不可恢复,请谨慎操作。 删除连接器 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“连接器”。 在连接器管理页面,单击已创建连接器后的,选择“删除”。 在弹出的确认框中,单击“确定”,即可删除连接器。
复制连接器 创建同类型HTTP连接器时,通过复制连接器功能,可减少重复操作,提升开发效率。 复制连接器 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“连接器”。 在连接器管理页面,单击已创建连接器后的,选择“复制”,可复制连接器。
单击,打开“发布链接”开关,获取页面访问地址。 图13 打开发布链接 单击,可生成新的链接,原链接将不可访问。单击,可复制该链接。 设置访问限制。 如果是新建项目,需要为发布链接设置访问限制,即“分享码访问”或“Token认证”必须设置其中一个,否则链接在运行态无法正常访问。本入门中,以设置分享码为例进行介绍。
右,如图2)的距离,默认为0,即铺满整个组件。 配置 在配置中,进行自定义属性设置。 图4 全屏配置 全屏图片链接:要切全屏时图片的链接。 展开图片链接:展开时图片的链接。 内边距:图片和组件边框之间的内边距,单位为px。 交互 在交互中,配置全屏组件与其他组件或页面之间的交互能力。交互设置更多介绍,请参见交互设置。
参考创建页面中操作,创建一个大屏页面。 在大屏开发页面,单击页面上方的,保存页面。 保存成功后,单击页面上方的,进行页面发布设置。 打开发布链接。 图1 打开页面发布链接 在访问限制中,配置内容安全策略。 例如,将A市交通管理大屏嵌入第三方系统,如图2所示。 图2 安全策略设置样例 其中,“fr
版本回退。 管理页面版本 开发好某个大屏页面,例如在页面中拖入基本饼图组件,保存后单击发布图标。 图1 开发页面 打开“发布链接”开关,生成发布后的页面链接。 单击“+ 新建版本”,会生成一个页面版本。 图2 新建第一个版本 单击新建版本后的,将该版本设置为当前发布页。 图3 设置发布页
3D场景编辑器 图观端场景编辑器用于实现3D模型的展示和编辑。购买“Astro大屏应用企业版”实例时,才会显示该组件。 在大屏设计页面,从“全部组件 > 3D场景编辑器”中,拖拽“图观端场景编辑器”组件至画布空白区域,如图1。 图1 图观端场景编辑器 配置 在配置中,为图观端场景编辑器设置容器名称和场景地址。
边距:组件中图表距离整个组件四边(上、下、左、右)的距离(参见图2),默认为0,即铺满整个组件。 图片地址:支持输入图片地址,来展示图片。 链接:设置单击图片后,跳转的链接地址。 图片设置:设置图片填充方式,并选择对应图片。 数据 在数据中,配置图片组件的数据来源,更多介绍请参见数据接入。 交互
HTTP连接器数据源 前提条件 参考新建连接器中操作,创建HTTP连接器。 新建HTTP连接器数据源 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。 在数据源管理页面,单击“新建数据源”。
ROMA连接器数据源 第三方接口或服务通过配置为ROMA连接器的方式,接入外部数据。 新建ROMA连接器数据源 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。 在数据源管理页面,单击“新建数据源”。
预置400+各类组件,配合自定义组件能力,实现用户多样数据可视化诉求。快捷配置帮助用户轻松调整布局。 特性优势 丰富的组件:各类图表、地图、视频、二三维引擎、Echarts组件等,快速进行数据可视化。 自定义组件能力:提供自定义组件能力及配套脚手架,轻松实现用户定制化二次开发。 多
magno对象预置API一览表 表1 magno对象预置API一览表 API API说明 savePropertiesForWidget() 用于在开发态中保存当前组件的高级设置属性信息。 savePropertiesForWidget() 该API用于在开发态中,保存当前组件的高级设置属性信息。
ue”)绑定页面级的全局变量(如“status”)。 图1 事件输出参数绑定全局变量 实现逻辑 自定义组件开发过程如下,也可以直接单击下载链接,获取自定义组件示例包“SelectWidget.zip”。 在组件的“global_SelectWidget.editor.js”文件中,新增eventConfig配置。
在配置中,设置地图组件的基本信息、地图控件和地图控制,如是否显示比例尺、是否支持缩放、拖拽等。 图4 OpenLayers地图配置 地图基本配置 地图链接:输入地图的链接。 切片大小:设置地图瓦片(Tile)的尺寸。 坐标系投影方式:将地理坐标系转换为平面坐标系的过程和方法,直接在下拉框中选择或者手工输入。
如何自定义动作 操作场景 在配置组件交互时,可以通过编写代码实现自定义交互动作,从而实现对应的业务需求。 图1 自定义动作 自定义动作参数说明 在自定义动作中,支持直接使用的参数如下: eventParam:组件传递出的参数。 以日期选择器组件为例,介绍如何获取eventParam。
台申请。 天地图第三方密钥,请参考天地图官网申请。 自定义地图:根据实际需求,自定义地图。如果开启自定义地图,请配置地图GeoJson数据链接地址或配置GeoJson数据素材。 地图中心经度:设置地图中心点的经度。 地图中心纬度:设置地图的中心点的纬度。 地图缩放级别:设置地图的
echarts组件自定义动作交互设置 echarts组件作为响应器的动作时,可以在自定义动作中设置。 自定义动作交互设置 选中某个echarts组件,单击。 在自定义动作中,单击“新增自定义动作”,修改动作名称为“设置数据高亮”。 图1 新建自定义动作 在动作实现中,输入如下代码,调用echarts提供的动作API。