目录 回顾 预备知识:指令 预备知识:通道 1. 生成并执行指令 1.1. Primitive 生成指令 1.2. Context 对象负责执行 WebGL 底层代码 2. 多段视锥体技术 3. 指令对象的转移 筛选可见集 4. 本篇总结 回顾 书接上文,Scene.js 模块内的 render 函数会将控制权交给 WebGL,执行 CesiumJS 自己封装的指令对象,画出每一帧来. 模块内的 render 函数首先会更新一批状态信息,譬如帧状态.雾效.Uniform 值.通道状态.三维场景中…
目录 API 用法回顾 1. 为什么要从 Viewer 访问 Entity API 1.1. 高层数据模型的封装 - DataSource API 1.2. 显示管理器 DataSourceDisplay 与默认数据源 CustomDataSource 1.3. 默认的数据源 - CustomDataSource 1.4. DataSource API 与 Scene 之间的桥梁 2. 负责 DataSource API 可视化的一线员工 - Visualizer 2.1. 为 CustomDa…
很高兴你能在浮躁的年代里还有兴趣阅读源代码,CesiumJS 至今已有十年以上,代码量也积累了三十多万行(未压缩状态). 我也很荣幸自己的文章能被读者看到,如果对你有帮助.有启发,点个赞就是对我最大的鼓励,感激不尽.本系列文章写于 2022 年,梳理的是 CesiumJS 前端库中的主要源码结构,不涉及着色器原理.WebGL 效果原理剖析等内容较为专一.可以独立出文的内容. 如果想看文章目录,直接拉到本文最后一节即可. 目录 1. 源代码工程目录详解 前置说明 ① 根目录下 ② Source 目…
目录 1. 对 WebGL 接口的封装 1.1. 缓冲对象封装 1.2. 纹理与采样参数封装 1.3. 着色器封装 1.4. 上下文对象与渲染通道 1.5. 统一值(uniform)封装 1.6. 渲染容器封装 2. 三类指令 2.1. 绘图指令(绘制指令) 2.2. 清屏指令 2.3. 通用计算指令 3. 自定义着色器 3.1. 早期 Fabric 材质规范中的自定义着色器 3.2. 后处理中的自定义着色器 3.3. 新架构带来的 CustomShader API 4. 总结 本篇涉及到的所有…
目录 1. 3DTiles 数据集的类型 2. 创建瓦片树 2.1. 请求入口文件 2.2. 创建树结构 2.3. 瓦片缓存机制带来的能力 3. 瓦片树的遍历更新 3.1. 三个大步骤 3.2. 遍历器 3.3. 选择瓦片 3.4. 请求并解析瓦片内容 3.5. 更新瓦片并创建 DrawCommand 3.6. prePassesUpdate 也能创建 DrawCommand 3.7. 自定义着色器 3.8. 样式引擎 3.9. 其它 4. 本文总结 3DTiles 与 I3S 是竞争关系,可是…
近些年来,越来越多的JavaScript框架(即AngularJS,BackboneJS,ReactJS)变得越来越流行.许多公司和开发人员使用这些JavaScript框架开发应用程序.这些框架有很多的优势: 前端和后端独立开发 JavaScript框架+RESTFUL的API(或微服务架构) SPA(Single Page Application) 某种程度上有利于提高开发效率 但是使用JavaScript框架对前台尤其是需要支持搜索引擎的页面是很有问题的,这是因为我们使用这些框架基本上都是基…
如何让手游更省带宽,耗电量更少?渲染或是其中一个可突破的点.本文中,腾讯游戏学院专家Hailong将从为大家解析TBR渲染架构的特点. 什么是TBR? 全称是Tile Based Rendering,主要用在移动设备(手机.平板)上的一种渲染架构,渲染时将屏幕分割成小块,分别渲染.每块大小为16×16 或32×32等(不同产品各不相同),特点是省带宽,耗电小. 与之对应的是IMR(Immediate Mode Rendering),提交的每个渲染要求都会立即开始,这是一种简单而又粗暴的思路,优点…
angularjs如何在视图渲染结束之后,或者render之后执行指令中的link方法 关键字: $timeout app.directive("myDirective",function($timeout){ return{ restrict:"A", link:function(scope,element,attrs,accordionController){ $timeout(function(){ element.click(function(){ aler…
目录 1. ModelExperimental 的缓存机制 1.1. 缓存池 ResourceCache 1.2. 缓存对象的键设计 ResourceCacheKey 2. 三维模型的加载与解析 2.1. GltfLoader 的初步加载 2.2. GltfJsonLoader 请求并解析 glTF 的 JSON 部分 2.3. 状态判断 2.4. glTF 的延迟处理机制 - 使用 ES6 Promise 2.5. 模型组件创建 2.6. 模型场景图结构的创建 2.7. 本节小结 3. 模型的…
目录 API 回顾 1. 对象层级关系 1.1. Scene 中特殊的物体 - Globe 1.2. 地球 Globe 与椭球 Ellipsoid 1.3. 瓦片四叉树 - QuadtreePrimitive 及其成员 2. 瓦片四叉树单帧四个流程 3. 更新与起帧 3.1. 更新过程 - Globe 的 update 3.2. 起帧过程 - Globe 的 beginFrame 4. 瓦片的渲染 - Globe 的 render 4.1. 选择要被渲染的瓦片 - selectTilesForR…