检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
初识开发页面 可视化开发页面 AstroCanvas一站式数据可视化开发页面，由可视化组件、图层、页面数据集、画布、功能按钮和主题六个区域组成，各区域功能介绍请参见表1。 图1 可视化开发页面 表1 可视化开发页面功能说明 序号 名称 说明 1 组件 在全部组件中，可以查看到各种
新建并开发自定义组件 操作场景 当系统预置的组件无法满足用户需求时，用户可自定义组件包进行上传，在页面中进行使用。在开发自定义组件前，请仔细阅读自定义组件开发规范章节内容，了解组件的开发规范。下面以开发网站中常用的柱状图（vue2+Echarts）组件为例，向您介绍如何开发自定义组件。
使用AstroCanvas开发大屏、移动端页面，支持通过管理页面版本，设置发布具体哪个版本的页面或者回退到具体哪个版本的页面进行开发。 操作场景 在AstroCanvas中，如下两个场景会使用到页面版本： 场景一：开发者开发好第一个页面版本后，发布呈现给用户。然后继续开发页面但未开发完，此时用户
AstroCanvas支持设置页面级的全局变量，通过页面组件间的交互，可给全局变量赋值。本章节将以开发一个告警监控页面为例，逐步介绍如何开发一个基于全局变量的交互页面。 场景说明 开发一个告警监控页面，如图1所示，在页面上方下拉框中选择告警状态，可查看各个地区相应状态下的告警数量分布。
使用AstroCanvas开发告警处理情况统计移动端页面 应用场景 通过AstroCanvas开发一个告警处理情况移动端页面，开发完成后，用户可通过移动端访问该页面，查看告警处理情况。移动端页面构想，如图1所示。 图1 移动端页面效果 图1中移动端页面，由下列组件拼装而成。 表1
自定义组件开发规范 代码结构介绍 组件配置项（Config配置） 组件内置API 组件数据接入 组件交互
发布项目 项目开发完成后，可以直接在线预览，也可以一键打包从A环境发布、B环境安装，实现开发 > 测试 > 上线的快速部署，从而实现不同环境之间资产的快速迁移。发布项目，支持将项目中的数据集数据一并进行打包。 前提条件 发布项目前，请确保项目中的页面已发布。 发布项目 参考登录A
资源，减少重复开发，提高交付效率。 使用页面模板文件新建页面：将已开发的页面保存为模板，再次创建页面时可使用该页面模板文件，创建可视化页面，减少重复开发，提高交付效率。 发布及安装项目 项目开发完成后，可以在线预览，也可以一键打包从A环境发布、B环境安装，实现开发 > 测试 >
的实际实现 */ render() { const widgetContainer = this.getContainer(); if (!widgetContainer) return; this.initI18n(); this.initReaderVm(this
私有化部署是指将在AstroCanvas企业版实例中开发的项目打包下载，并安装部署到用户的内网中使用。 操作流程 私有化部署AstroCanvas的操作流程，如图1所示。 图1 AstroCanvas私有化部署流程 步骤一：购买AstroCanvas企业版实例 购买一个AstroCanvas企业版实例
分享码必须符合如下五个条件。 长度为8~32位，仅包含英文字母、数字、特殊字符。 至少包含一个英文小写字母（a-z）。 至少包含一个英文大写字母（A-Z）。 至少包含一个数字（0-9）。 至少包含一个特殊字符（~!@#$%^&*()_=+\|[]{};:'",<.>/?-） ：单击该图标，可查看设置的分享码。
设置页面标题 系统自动进入大屏开发页面，如图12。您可以直接使用该大屏页面，也可以根据业务需求进行二次开发。 图12 大屏开发页面 单击页面上方的，完成大屏页面的创建。 步骤五：预览并发布大屏页面 在AstroCanvas中开发大屏页面时，支持直接在线预览效果，确保开发编辑效果与发布后运行
使用AstroCanvas开发人员来访统计大屏页面 应用场景 人员来访统计大屏用于展示园区中人员相关信息，例如人员类型，人员流量及在园人数等。大屏页面构想，如图1所示。 图1 大屏页面效果 图1中大屏页面由下列组件拼装而成，组件介绍顺序为从上到下、从左到右。 表1 组件说明 组件
troCanvas在设计前期对分类也进行了分组，因此这个字段被扩展为双数组形式。一般默认情况下，直接在数组对象的第一个数组中配置即可。如果无配置，则所有属性展示在一个大的分类下。 classfication中的配置包含预置分类和自定义分类两种。 预置分类：主要是使用平台预置分类。
setCookie("key","value") getI18n 一般用于在初始化阶段返回一个Vue18n的实例，配合Vue和VueI18n使用。使用方式参考如下： /* * 该Vue18n实例可以在new一个Vue实例时赋值为i18n参数。 */ HttpUtils.getI18n({
分享码必须符合如下五个条件。 长度为8~32位，仅包含英文字母、数字、特殊字符。 至少包含一个英文小写字母（a-z）。 至少包含一个英文大写字母（A-Z）。 至少包含一个数字（0-9）。 至少包含一个特殊字符（~!@#$%^&*()_=+\|[]{};:'",<.>/?-） ：单击该图标，可查看设置的分享码。
String belong: "configuration", 归属于classfication中哪一个分类。 config Array config: [] config数组中，每一个对象保存的配置项信息。config中，配置项的介绍，请参见组件配置项（Config配置）。 父主题：
getSafeUrl('javascript:alert(123)') //return:'unsafe:' 只有安全的链接才会被访问，其他形式的URL都会响应一个“unsafe:”，无法访问。 父主题： 组件内置API
新增项目变量 项目变量是整个项目中所有页面都可以的变量，当项目中页面较多且各页面会使用同一个变量时，通过创建项目变量，可以提高开发效率，提升易用性。 创建项目变量 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在AstroCanvas界面的项目列表中，单击已创建的项目，进入项目。
复制页面 AstroCanvas支持复制页面，减少重复开发，提高交付效率。 复制页面 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在项目列表中，单击页面所在的项目，进入项目。 将鼠标放在待复制的页面上，单击。 在弹出的提示框中，单击“确定”。 输入页面标题，单击“新建”。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
