开发者必看！图观™统一开发API及API调试器入门第一讲

图观引擎

已于 2022-07-15 14:59:44 修改

阅读量335

点赞数

分类专栏：图观™引擎统一API调试器文章标签： javascript 前端 java

于 2022-07-12 16:50:07 首次发布

本文链接：https://blog.csdn.net/tuguan_digitail/article/details/125745985

版权

图观™引擎统一API调试器专栏收录该内容

7 篇文章 0 订阅

订阅专栏

课程1：图观统一开发API概述

哈喽，小伙伴们大家好，欢迎大家来到图观统一开发API及 API调试器入门课程。

图观统一开发 API 是一套基于 JavaScript 语言开发的二次编程接口，用于在现代浏览器中加载、显示图观引擎提供的流渲染或端渲染三维场景，并且为开发者提供在场景中绘制业务数据、触发场景交互、控制场景逻辑的功能。

（部分API集锦）

图观统一开发 API 兼容当前主流的 JavaScript 前端框架，例如 Vue.js 或者 React，前端开发人员可快速便捷的进行二次开发。

图观™统一API调试器，是帮助我们进行API调试、便捷开发的核心产品。学习图观统一开发API及 API调试器，小伙伴不再需要对产品每个功能进行代码开发，可以更加便捷高效地构建功能丰富的数字孪生应用，大幅降低开发难度、提高开发效率。

本节课程安排

课程1：图观统一开发API概述

课程2：使用统一API调试器

课程3：创建应用和场景

课程4：镜头操作

课程5：图层操作

课程6：模型操作

课程7：模型图层操作

课程8：聚焦

课程9：拾取和选择

课程10：环境效果

课程11：GIS图层操作

通过这11节课程的学习，我们的最终希望就是小伙伴们都能亲自上手构建出功能强大、效果出众的数字孪生应用！

本节课程安排

第一部分：图观统一开发API 接口概览

第二部分：图观统一API调试器概览

第三部分：图观统一开发API 接口体系

第四部分：图观统一开发API 方法指令范式

第五部分：图观统一开发API 方法回调结果范式

第六部分：图观统一开发API 事件订阅范式

图观™引擎统一API调试器零基础入门课程1《图观统一开发API概述》

（点击视频，观看本节完整版教程）

本节课程详解

一、图观统一开发API接口概览

使用图观统一开发API，开发人员可以完全释放图观场景的二次开发能力，开发出从手机端的轻量化应用，到具有复杂功能和交互的大屏应用。

图观统一开发API针对典型数字孪生应用开发所需接口进行了良好封装，并且对于底层渲染核心，无论是端渲染还是流渲染都可完美适配。开发者无需进行每项功能的代码编写，只需要了解JavaScript就可以快速上手，接口调用和消息结构也相对简单，熟悉一种渲染核心的开发后，可以快速上手另外一种渲染核心的开发。甚至在场景资源具备的情况下，开发好一种渲染核心的应用，可以无缝迁移到另外的渲染核心。充分满足显示效果和高并发的要求。

这也就引出了图观统一开发API支持的两种渲染技术架构——端渲染和流渲染。下面我们为大家简单介绍两种渲染核心的技术架构。

端渲染：

图观端渲染开发架构，是基于 HTML5 和 WebGL 技术，整合推出的数字孪生端渲染技术支撑体系，涵盖端渲染场景编辑器、端渲染场景服务、端渲染二次开发等技术产品，覆盖数字孪生应用开发的全生命周期，提供简便、快捷、强大的数字孪生应用运行和开发平台。

流渲染：

图观流渲染开发架构，是基于实时云渲染（ GPU 云化）、视频串流等技术，整合推出可视化数字孪生流渲染解决方案技术支撑体系，涵盖：流渲染场景构建服务、流渲染场景服务、流渲染二次开发等技术产品，为大规模场景渲染在轻量化终端上的呈现提供技术保障。

二、图观统一API调试器

通常与图观统一开发API配合使用的，是图观统一API调试器。

图观统一API调试器可调用图观端渲染及流渲染三维场景服务，基于统一开发API示例代码，进行简单修改代码模板，即可快速调试场景交互效果，修改操作所见即所得，助您快速掌握开发技能。

图观统一API调试器内置图观统一开发API全部接口的示例代码，支持单体测试和综合测试两种模式。

单体测试：针对每项接口，可快捷编写控制逻辑、数据绘制代码，点击执行，立即看到结果；

综合测试：支持组合 API 调用，调试复杂逻辑代码，灵活满足各种开发需求。

此外，图观统一API调试器还支持数据图层标绘，可在场景中进行点/路径/区域标绘，并基于标绘数据，可自动生成数十类 API 调用代码；并支持填充模拟数据，大幅降低项目前期没有真实数据时，模拟数据开发的难度和工作量。

三、图观统一开发API接口体系

在图观统一开发API 3.3正式发布的版本中，共有接口总数500余个，按照接口功能的分类，可以分为：

1.全局接口

应用生命周期管理，服务调度，场景调度，状态调度，镜头操作，时间天气和其他辅助功能。

2.图层接口

各种可视化图层的添加、删除、更新数据、更新样式功能。图层包括单对象图层、多对象图层和GIS图层。

3.模型接口

添加和控制模型等等，包括普通模型和建筑模型。普通具有关节和动画控制能力。建筑模型具有楼层、房间的控制能力。另外还可以试用模型轨迹图和特效图层。

4.事件

监听各种方法执行的结果或用户交互行为。

四、图观统一开发API方法指令范式

图观统一开发API，除了构建应用使用的new TGApp.app()，和初始化服务appInstance.initService()两个接口以外，都是使用appInstance.uniCall(action, parameter, callback) 方法来调用的。

如图所示，第一个参数为指令名称，第二个参数为指令参数，第三个参数为回调函数。

五、图观统一开发API指令回调结果

图观统一开发API每个uniCall的指令调用，在第三个参数都包括一个callback回调函数。回调函数的结果，通过一个Object类型的对象返回。对象的基本结构图所示：

我们以一个端渲染场景为例，调用获取应用状态信息的指令：

可以在控制台中，看到result结果内容

可以看到，getAppInfo的callback中，除了包括调用是否成功的基础信息，还包括了TGAPI的版本信息，客户端控件大小信息等，为调试程序提供有了用的帮助。

六、图观统一开发API事件订阅

如上方提到的，图观统一开发API的事件订阅指令为addEventListener, 参数对象中包括了eventName和一个回调函数callback，其中eventName是需要监听的事件，callback为事件触发时执行的方法。同一个事件，可以监听多次，执行不同的方法。

对应的，取消事件订阅指令为removeEventListener，可以移除指定事件和回调函数的对应关系。例如：