检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
文件介绍及示例 文件介绍 {widget}.editor.js为组件属性定义文件,负责组件编辑状态时需要渲染的界面和逻辑。其中,“{widget}”为自定义组件的名称,如本示例中该文件名为“EchartsWidgetTemplate.editor.js”。{widget}.editor
华为云Astro大屏应用的管理员权限,拥有该权限的用户可以使用服务的所有功能。 系统策略 Astro Canvas FullAccess策略内容 Astro Canvas InstanceManagement 华为云Astro大屏应用实例管理权限,拥有该权限的用户,可以创建和管理实例。 系统策略
选择所需的数据类型。 在配置流程中,通过SQL语句,获取数据。 数据接入的SQL语句中,需要添加4中创建的全局变量offset和pageSize,来限制每次获取的数据。 图5 输入SQL语句 图6 输入“$”添加全局变量 在组件预览中,将表格中的字段,拖拽到对应的配置中。 数据中的t
组件数据接入 组件对接数据配置开关 组件的数据可来自于静态数据或通过数据集获取,以EchartsWidgetTemplate组件为例,在“{Widget}”.editor.js文件中,可配置组件接入的数据。当识别到组件propertiesConfig中存在dataSetting类
propertiesConfig是一个数组,用于保存组件配置项的相关字段,包括数据接入配置、组件配置项。 图1 propertiesConfig配置示例 数据接入配置 数据接入配置详细介绍,请参见组件数据接入。 组件配置项 配置示例如下,配置后效果如图2所示,组件配置项详细介绍请参见表1。
数据标记柱图 数据标记柱图是柱状图的一种,通过柱形图的形式展现数据的整体表现,额外的数据标注更直观的展现数据的大小。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“数据标记柱图”组件至画布空白区域,如图1。 图1 数据标记柱图 图2 边距样式说明 卡片 卡片是指包裹图表组件的
下载项目 项目发布后,在项目发布的版本管理中,可下载对应版本的项目包。 约束与限制 在华为云Astro大屏应用中导出项目时,项目包中包含的数据源密码会被置空。 下载项目 在华为云Astro大屏应用界面的“项目列表”页面,单击待下载项目上的。 在版本管理中,鼠标放在对应版本后的“操作”下,单击。
{widget}.ftl 文件介绍 {widget}.html为组件DOM结构文件,相当于HTML文件,负责样式展示。 在华为云Astro大屏应用中自定义组件时,需要在服务端提前渲染的部分,可以写在此文件中。 文件示例 <div id="EchartsWidgetTemplate"
自定义围栏数据 热力图层数据:热力图层数据桥接器/数据集,根据省/直辖市数值大小,热力图层颜色深浅不一。 柱状图层数据:柱状图层数据桥接器/数据集,根据省/直辖市数值大小,柱子颜色、高度不一。 标签图层数据:标签图层数据桥接器/数据集,以标签形式展示省/直辖市具体数据。 交互 在
在动作详情中,“响应组件”选择echarts组件,“响应动作”选择“设置数据高亮”,“dataIndex”设置为“0”。 图3 设置动作详情 保存交互设置,预览页面,echarts组件渲染首个数据获得高亮效果。 图4 查看渲染效果 父主题: 组件管理
图片默认为匿名可访问,请勿上传包含敏感数据的图片。 图1 设置项目封面 页面缩略图:使用项目中,页面的缩略图,作为当前项目的封面。 上传封面:单击“上传封面”,从本地上传图片作为项目的封面。建议使用596*328尺寸的图片。 默认封面:使用系统提供的默认封面,作为当前项目的封面。 父主题: 项目管理
华为云Astro大屏应用已预置了静态数据,如果需要自定义静态数据,请重置数据。 数据集 选择在“数据中心”中配置的数据集,作为组件数据来源。选择此方式时,请确保数据集已在数据中心创建,详情请参见数据中心。 不是所有的组件都支持数据源设置,组件开发时的属性配置代码中添加“dataSetting”相关配
页面数据集 操作场景 通过页面数据集,实现多个组件对接同一个数据输入,减少重复的请求和配置。同时,在新建页面数据集时,还支持配置多数据输入(最多10个),来实现组件同时对接多个数据流。 本章节以将两个静态数据集(多数据流1、多数据流2)中的数据汇合后,作为组件的数据来源为例,向您介绍如何创建并使用页面数据集。
资源设置 库是支撑页面组件运行的第三方依赖,如果缺少相应的库,则组件不能正常运行。在项目的资源设置中,您可以管理页面中使用到的库。 资源设置 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在华为云Astro大屏应用界面的项目列表中,单击已创建的项目,进入项目。
et相当于拼图的每一小块。 数据中心 数据中心用于对数据源进行集中管理,将数据源配置简化,降低技术门槛,让业务人员可快速完成配置。华为云Astro大屏应用当前支持如下几种类型的数据集,其与数据源、转换器和目录之间的关系,如图1所示。 图1 数据源、数据集、转换器、目录之间的关系图
用,缓解数据包嗅探攻击。 设置内容安全策略 参考创建页面中操作,创建一个大屏页面。 在大屏开发页面,单击页面上方的,保存页面。 保存成功后,单击页面上方的,进行页面发布设置。 打开发布链接。 图1 打开页面发布链接 在访问限制中,配置内容安全策略。 例如,将A市交通管理大屏嵌入第三方系统,如图2所示。
packageinfo.json 文件介绍 packageinfo.json是组件的元数据描述文件,用于配置组件的基本信息。 文件示例 { "widgetApi": [{ "name": "EchartsWidgetTemplate" }], "widgetDescription":
css 组件的样式文件,在该文件中编写组件的CSS样式。 EchartsWidgetTemplate.ftl 组件DOM结构文件,需要在服务端提前渲染的部分可以写在此文件中,相当于HTML文件,负责样式展示。 packageinfo.json 组件的元数据描述文件。 widegtApi
管理组件模板 查看组件模板详情 参考登录华为云Astro大屏应用界面中操作,登录华为云Astro大屏应用界面。 在主菜单中,单击页面右上方的“管理”,进入华为云Astro大屏应用管理页面。 在左侧导航栏中,选择“页面资产管理 > 组件模板”。 在“全局”页签中,单击对应的组件模板。
设置组件数据源。 选中组件,单击组件上方的。 选择所需的数据类型。 在全局变量配置下方,单击“+”,选择转换器,添加2创建的转换器。 图5 添加转换器 在组件预览中,将表格中的字段,拖拽到对应的配置中。 图6 从表格字段中拖拽字段到对应配置中 单击“保存”,完成组件数据源的配置。