哈喽，小伙伴们大家好~欢迎大家来到图观™应用编辑器零基础入门课程第2课。

1. 登陆图观™应用编辑器
首先我们打开谷歌浏览器，输入图观网址 https://www.tuguan.net 并访问，然后我们就进到了图观的官网。

如果第一次访问图观，首先需要注册一个账户，可以 添加图观客服微信索取邀请码。填写邀请码和基本信息后，就开通了图观的账号。

点击官网导航栏右侧的【登录】按钮，就看到了登录界面，输入已开通好的账号和密码后 点击【登录】，我们就进到了图观业务管理界面，能看到在“我的业务”中有“租户服务”、“端渲染场景服务”、“接口调试器服务”、“应用编辑器服务”4种服务，我们 选择“应用编辑器服务”点击【前往】按钮，这样我们就进入到了应用编辑器的首页了。

2. 应用编辑器首页介绍
进入到应用编辑器的首页页面， 页面左侧是项目管理列表，在这里我们可以对所有项目进行分类整理，便于后续对项目的查找和管理。中间tab栏切换工作台和资产库，工作台可新建项目并展示所有已创建项目；资产库中的资产内容可以在各个项目共享使用，页面右上显示公告，帮助及用户设置。

3. 创建项目"智慧社区运营中心"
点击“新建可视化项目”，在弹出的窗口中输入中文名称、英文名称，点击“确定”按钮即可完成项目的创建。鼠标悬停在项目面板上可以唤醒隐藏的功能菜单，我们可以 对该项目进行“重命名”“移动”“复制”“删除”，也可以点击“进入项目”按钮，系统将会进入该项目首页。

4. 项目首页介绍
进入到编辑中的项目首页。我们可以看到左侧为页面管理列表，在这里我们可以对所有页面进行分类整理，中间为tab栏切换显示 “页面编辑”“组件编辑”“参数编辑”“接口编辑”“数据编辑” ”图片素材”等六大管理页签。默认的是选中了“页面编辑”，可新建页面并展示所有已创建的页面。界面右上角可以对项目进行设置、刷新、预览、发布等操作。

5. 新建页面“社区概览”

在项目首页中，默认选中“页面编辑”的页签。点击“新建页面”按钮，在新建页面面板中，有两种创建页面的方式可以选择——【创建空白页面】和【创建模板页面】。

【创建空白页面】 ：是在界面的左上侧，选择“空白页”，鼠标点击右侧面板“创建”按钮，在弹出的“新建页面”输入框中输入所创建页面的名称，再点击“确定”按钮即可完成页面的创建。

【创建模板页面】 ：是指在基于系统自带的模板库创建页面，目前模板库包括红、橙、黄等不同色系的模板，还有简约、现代、科技等不同风格的模板。

同样的操作我们把另外2页面“人车感知”、“安全态势”新建出来，这样整个“智慧社区运营中心”孪生应用涉及的3个页面“社区概览”“人车感知”“安全态势”我们就创建完成啦~

6. 页面操作介绍

那对于已创建的页面我们做哪些操作呢？

大家可以看到 页面卡片上有“重命名”，"锁定/解锁"的按钮，当我们把鼠标悬停页面卡片上时就能唤醒隐藏的功能菜单，可以看到有 "设为首页""预览"“移动”“复制”“删除”"隐藏" "导入租户资产"“编辑”等按钮。

*点击页面卡片左下角的 “重命名”按钮，可修改项目的名称；

*点击页面右下方的 “锁定/解锁”按钮，即可对页面进行解锁或是锁定。当页面处于锁定状态时，只可以进行“设为首页”和“预览”操作，无法对其进行“编辑”等操作。

*鼠标悬停某个指定页面卡片，点击功能菜单中的 “设为首页”按钮，即可把当前页面设为首页。大家可以看到，设为首页的页面卡片左上角会有一个小图标；

*点击 “预览”按钮，即可预览该页面。一般是等我们将页面配置完成后，想要预览该页面内容的时候，可点击这个按钮；

*点击 “移动”按钮，在弹出面板中选择指定页面文件夹，点“确定”按钮即可将此页面移至所选文件夹下；当页面较多时可以进行分类管理；

*点击 “复制”按钮，会在同级目录下为该页面生成一个新的副本；

*点击 “删除”按钮，即可删除当前页面；

*点击 “编辑”按钮，即可进入编辑界面；

*点击 “隐藏页面”按钮，即可隐藏当前页面；隐藏的页面在左侧下方，鼠标悬浮隐藏页面可唤醒“反隐藏”按钮，点击该按钮可取消页面隐藏；

7. 页面编辑界面介绍

鼠标悬停指定页面唤醒隐藏的功能菜单，点击“编辑”按钮，进入页面编辑界面。

“资产库“页签中包含系统资产和租户资产 ，系统资产里放置了我们丰富多样的资产控件：包括柱状图、条图、折线图、比例图、比较图、列表、仪表盘、控件、媒体等类型，租户资产是我们租户账号下导入到租户资产的图片和组件。

我们可以选中左侧的对象列表中的多个控件，右击鼠标进行控件成组的操作，选中单个/成组的控件可进行置顶、置底、上移一层、下移一层、锁定、隐藏、重命名、复制、删除的操作。

根据模板创建的页面，模板会默认带一个图片背景，为了后续操作需要隐藏“背景组”中的“底背景图”，我们可以找到该对象，并点击“隐藏”按钮。可以看到该对象被我们隐藏起来了。

这里要跟各位小伙伴介绍一下 对象列表中锁定和隐藏的区别，锁定是指对象可见但是在编辑器中不可以被选中和修改，一般用于界面元素，如遮罩。 隐藏是指在编辑器中不可见，同样也不能被选中和修改。

11. 获取并设置"智慧社区"场景

点击“选择场景”按钮，弹出“选择场景”窗口，在【本项目】中点击“添加文件夹”按钮，随后输入文件夹名称“智慧社区”，点击回车即可完成项目文件夹的创建，选中文件夹，点击“添加场景”，弹出“添加场景”窗口，在文本框中输入获取的“智慧社区”场景二次开发地址，点击"确定"，选中调用的场景后点击“选择场景”窗口中的确定按钮，等待场景加载成功。

12. 进入“社区概览” 页面 调用场景设置

我们进入到 “社区概览”页面的编辑界面，在编辑页面的右侧属性面板下，点击 “场景设置”按钮，对场景进行相应的设置操作。

最上方点击 “预览场景”按钮，进入场景预览状态，可在编辑器中对场景进行了拖动/放大/缩小/旋转等操作，前提是完成场景选择加载后，才可以进行预览场景。

场景状态选项 ：是指默认加载的三维场景状态，点击下拉菜单显示场景的状态列表，根据需求选择相应的状态。本页面选择“社区概览”状态，当三维场景进行了拖动/放大/缩小/旋转等操作时，点击“复位”按钮，可将场景状态复原到场景的默认状态。

场景初始化代码选项 ：是指场景初始化完成后，若对场景初始化有特殊需求，可打开“勾选框”按钮，点击“初始化代码”按钮，输入想要执行的场景初始化代码，点击确定即可。本案例没有场景初始化代码，此处就不设置了。

场景尺寸选项 ：默认可自定义场景尺寸宽1920，高1080。

场景位置选项：默认可自定义场景位置左为0，上为0。

全屏模式选项：是指场景尺寸即全屏页面尺寸，“场景尺寸"和"场景位置"就不可以更改了。

加载场景选项：是指在编辑页面时，是否加载场景，关闭这个选项可以优化应用编辑器的页面性能，只编辑二维图表，关闭加载场景不会影响发布后的页面，也不会丢失已经配置的图层设置和模型设置。 一般建议点击开启该按钮。

等待场景加载完成选项：是指在预览页面或者发布后的浏览页面，是否等待场景加载完成后页面上二维图表才可以点击。 一般建议开启该按钮。

图层在最前选项：是指在场景中添加的图层和场景底座模型的遮挡关系，如果开启图层永远会在模型前，如果关闭，图层和模型会有三维空间中的透视遮挡关系。一般建议开启该按钮。

在图观™官方网站中，您可获取图观™最新产品技术动态以及全面的开发指引，帮助您快速了解图观™数字孪生可视化引擎 。