检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
动填写。 目录名称 组件的存放目录，本示例选择“其它”。 场景 该组件包应用的场景，可根据业务需求选择“大屏&PC端”或“移动端”。 版本说明 该组件的描述信息。设置后，内容将会在组件详情页的“概况”页签下进行展示。 操作 单击操作列中的，可上传组件图标。 单击操作列中的，可删除上传的组件包。
事件名称 调用配置项中的方法 说明 回调参数 change change 仅在输入框失去焦点或用户按下回车时触发 (data, field) blur blur 在输入框获得焦点时触发 (value, data, field) focus focus 在输入框失去焦点时触发 (value
作用域。 图3 设置全局变量 图4 查看全局变量作用的域 页面开发流程 在AstroCanvas可视化开发页面，通过拖拽组件、设置页面布局、对接业务数据等，即可构建AstroCanvas大屏&PC端/移动端页面，具体流程如图5所示。 图5 页面开发流程 页面设置 配置页面屏幕大小
图9 设置组件数据 选中文本编辑组件，单击组件上方的，设置组件显示的内容。 图10 设置文本编辑组件显示内容 单击“新增条件格式”，设置条件和响应数据列的样式。 如下图所示，该设置表示文本编辑满足设置的条件（组件数据中，第一个数据大于5）时，显示为红色，否则显示为正常颜色。 图11
个大屏页面的流程。 使用AstroCanvas开发告警处理情况统计移动端页面 本实践通过开发一个告警处理情况移动端页面，带您了解在AstroCanvas中开发一个移动端页面的流程。
添加组件 在AstroCanvas中，组件是大屏、移动端页面的组成元素。AstroCanvas提供了一些预置组件供您使用，同时支持自定义组件并上传到AstroCanvas中使用。 添加组件 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在页面编辑模式下，按照组件分类，查找到对应组件。
域名：AstroZero环境的域名，需要携带“https://”。 客户端ID：调用AstroZero接口前，需要配置“客户端模式”OAuth鉴权的客户端ID，获取方法请参考客户端模式接入认证。 OAuth认证过程中，新建认证密钥时授权类型需选择“客户端模式”，用户建议选择具有管理员权限（System Administrator
单击，可生成新的链接，原链接将不可访问。单击，可复制该链接。 设置访问限制。 如果是新建项目，需要为发布链接设置访问限制，即“分享码访问”或“Token认证”必须设置其中一个，否则链接在运行态无法正常访问。本入门中，以设置分享码为例进行介绍。 图14 分享码设置 分享码设置：设置页面分享码后，只能通过分享码来访问页面，提高安全性。
数字字体：设置数字的字体、大小和颜色等。 前缀：设置数字的前缀。 图6 设置数字前缀 字体大小：设置数字前缀的字体大小。 后缀：设置数字的后缀，如%。 字体大小：设置数字后缀的字体大小。 趋势图标：设置趋势的图标，可以自定义，也可以使用默认。 图标宽：设置趋势图标的宽度。 图标高：设置趋势图标的高度。 次要
API说明 savePropertiesForWidget() 用于在开发态中保存当前组件的高级设置属性信息。 savePropertiesForWidget() 该API用于在开发态中，保存当前组件的高级设置属性信息。 /* * @param {*} props {} */
组件。 配置 在配置中，设置翻牌器组件的样式和动画。 图4 翻牌器配置 样式设置 字体：设置翻牌器字体、大小和颜色等。 数字背景：翻牌器中数字是否显示背景。“动画类型”设置为“翻牌类型”时，不支持隐藏背景。 数字背景颜色：设置翻牌器中数字的背景颜色。“数字背景”设置为“显示”时，才会显示该参数。
占位符：没有输入搜索内容时，展示的文字内容。 搜索按钮设置 字体：搜索按钮和按钮字体的大小、颜色等设置。 背景颜色：设置搜索按钮所在区域的背景色。 按钮文本：设置按钮搜索图标后显示的文字。 数据 在数据中，设置搜索框组件的数据来源，更多介绍请参见数据接入。 交互 在交互中，配置搜索框组件与其他组件或
Echarts组件设置 在Echarts组件设置中，可以设置ECharts组件的初始化代码块、实例化代码块、自定义事件和自定义动作。 图4 代码设置 初始化代码块：初始化代码块输入框是一个javascript的执行环境，该执行环境的目的是调用echarts的init方法创建实例，此处
Profile）的用户。如何获取client_id，请参见客户端模式接入认证。 客户端密码：调用AstroZero接口前，需要配置“客户端模式”OAuth鉴权的客户端鉴权密钥。如何获取client_secret，请参见客户端模式接入认证。 描述：新建数据源的描述信息，可按需进行设置。 单击“连接测试”，显示“连接成功”，表示数据源可以调通。
配置 在配置中，进行自定义属性设置。 图4 全屏配置 全屏图片链接：要切全屏时图片的链接。 展开图片链接：展开时图片的链接。 内边距：图片和组件边框之间的内边距，单位为px。 交互 在交互中，配置全屏组件与其他组件或页面之间的交互能力。交互设置更多介绍，请参见交互设置。 父主题：
新建一个空白的大屏页面。 在AstroCanvas界面上方，单击“项目列表”。 在项目列表页面，单击“新建项目”。 输入项目名称，单击“新建”，新建一个大屏&PC端项目。 在新建的大屏&PC端项目中，单击“新建页面”。 单击“新建空白页面”，输入页面标题“全局变量示例页面”，单击“新建”。 在页面上方单击，新建并设置页面级全局变量。
边框：设置单元格的边框样式。 序列号：表格中序列号设置。 序列号：表格中是否显示序列号。 序列名：设置序列号的名称。 列宽占比(%)：设置序列号在表格中的列宽占比。 背景色：设置序列号的背景颜色。 半径：设置序列号的半径。 圆角：设置序列号圆角，0为直角。 字体：设置序列号的字体、大小和颜色等。
图标色：设置按钮的图标颜色。 图标选中色：设置选中按钮时，按钮图标的颜色。 配置 在配置中，设置组件的背景色、表格行数、表头和单元格等。 图5 树状表格配置 全局样式 背景色：设置表格的背景颜色。 表格行数：当前表格可视高度展示的数据行数。 边框：设置表格的边框样式。 表头设置 溢出文本：设置表格中超长文本的显示样式，如显示为省略号和换行显示。
AstroCanvas部署时通过物理区域划分，为项目级服务。授权时，“作用范围”需要选择“区域级项目”，然后在指定区域（如华北-北京4）对应的项目（cn-north-4）中设置相关权限，并且该权限仅对此项目生效。如果在“所有项目”中设置权限，则该权限在所有区域项目中都生效。访问AstroCanvas时，需要先切换至授权区域。
选择静态数据 根据业务需求自定义静态数据，也可直接使用系统预置的数据，单击“保存”。 您可以通过“Excel模式”和“Json模式”两种模式设置静态数据。设置为“Excel模式”时，可执行如下操作： 单击“文件导入”，可将本地的数据导入到当前组件中使用。仅支持导入CSV和Excel格式的文件，且文件大小不能超过100KB。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
