2019年09月_Webglzhang

09月 08月 04月 03月

原创 Three.js BIM模型轻量化 FPS渲染速率优化多实例渲染[Instance]+顶点合并[Merge]

BIM模型不经过处理，直接加载到Three.js 创建的场景中，很大可能会很使fps帧率下降，原因在于模型的个数太多，有的模型是多材质的话还需要在Three.js中绘制两次，这样会导致drawcall过载，虽然在开启视椎体剪裁的情况下，Three.js中已经进行了模型剔除的处理，但仍然很难解决drawcall过载的问题，可以F12 打开devtool看下cpu使用率。 ...

2019-09-08 11:52:53 4894 1

原创 JS 技能点get 留存

彻底明白JS线程https://www.jianshu.com/p/8821c6432fe1https://segmentfault.com/a/1190000012925872

2019-09-08 10:33:04 209

转载常用的空间数据结构(网格/四叉树/八叉树/BSP树/k-d树/BVH/自定义划分)

空间划分的数据结构(网格/四叉树/八叉树/BSP树/k-d树/BVH/自定义划分)目录网格 (Grid) 网格的应用四叉树/八叉树 (Quadtree/Octree) 四叉树/八叉树的应用 BSP树 (Binary Space Partitioning Tree) 判断点在平面前后算法 BSP树的应用参考 k-d树 (k-dimensional tre...

2019-09-08 10:26:04 6709 2

转载 Javascript调试命令——你只会Console.log() ?

Javascript调试命令——你只会Console.log() ?Console 对象提供对浏览器控制台的接入（如：Firefox 的 Web Console）。不同浏览器上它的工作方式是不一样的，但这里会介绍一些大都会提供的接口特性。Console对象可以在任何全局对象中访问，如 Window，WorkerGlobalScope 以及通过属性工作台提供的特殊定义。它被浏览器定义为 Wi...

2019-09-08 10:16:00 249

原创顶点着色器插值输出到片元着色器的三种方式—— flat、noperspective 、smooth（透视矫正）

以OpenGL为例，在https://www.khronos.org/opengl/wiki/Type_Qualifier_(GLSL)上，可以看到三种插值的方式。图片截图不是很清楚，就简单说一下这几种吧。1. flat 该值不会被差值2.noperspective该值将在窗口空间中线性插值3.smooth该值将以透视校正的方式进行插值，这也是默认的插值方式...

2019-09-08 10:05:08 1746

AR.js（摄像头前置）

现在手机大部分都是前后双摄，做AR的话，肯定是要后置摄像头的啦，但是AR.js在谷歌浏览器中，会打开后置，而现在QQ中则会打开前置摄像头。现在让我们开看看我们如何控制使用控制使用手机的前后摄像头。

2018-07-07

WebGL 2.0 FrameBuffer And RenderBuffer

在学习WebGL过程中，有一种技术叫二次绘制，就是把每一帧画面再次处理渲染，它能做好多高级效果的实现，如边缘检测，高斯模糊，SSAO等。二次绘制中最重要的就是FBO和RBO,接下来，我们来看看什么是FBO和RBO。 FBO就是由颜色附件（COLOR_ATTACHMENT0)，深度附件（DEPTH_ATTACHMENT），模板附件（STENCIL_ATTACHMENT）组成的一个逻辑存储对象。那RBO是什么呢，RBO是一个2D图像缓冲区，可以用于分配和存储颜色值，深度或者模板值，可以作为FBO的颜色，深度模板附件。

2018-05-22

webgl 2.0 camera

WebGL成像采用的是虚拟相机模型。在场景中你通过模型变换，将物体放在场景中不同位置后，最终哪些部分需要成像，显示在屏幕上，主要由视变换和后面要介绍的投影变换、视口变换等决定。其中视变换阶段，通过假想的相机来处理矩阵计算能够方便处理。对于WebGL来说并不存在真正的相机，所谓的相机坐标空间(camera space 或者eye space)只是为了方便处理，而引入的坐标空间。

2018-04-06

ar.js demo

（ar.js +three.js 高效WebAR） AR技术（增强现实技术Augmented Reality，简称 AR），AR技术在Native中已经兴起了，并且市场上有许多成功的APP，但是对于JavaScript怎么来玩转AR呢？下面我来简单的给大家做了基于ar.js的WebAR小例子。

2018-03-11

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

原创 Three.js BIM模型轻量化 FPS渲染速率优化 多 实例渲染[Instance]+顶点合并[Merge]