![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
three
hpugisers
每天进步一点点,美滋滋
展开
-
关于Tween的chain方法由于浅拷贝出现不能启用一个tween的bug
昨天由于版本升级把tween18.6.0升级到18.6.4结果封装的动画无法使用,究其原因是为了浅拷贝的问题出现问题的代码示例: this.tween = new TWEEN.Tween(this.startParms).to(this.targetParms, options.duartion); this.tween.easing(TWEEN.Easing.Linear.None); this.tweenback =原创 2020-11-26 10:54:45 · 1248 阅读 · 0 评论 -
Three.js在不改变原有材质的基础之上,增加额外的着色器逻辑
有时候在做特效的时候,我们想在原有着色器渲染之上来增加特效。不想使用ShaderMaterail材质类,如果使用该类书写着色器逻辑,会改变原有的渲染效果。原理利用着色器是字符串的本质,将原有的main函数提取,替换掉,重新定义main函数,将替换掉的main函数在新的main函数中执行。1、替换之前2、替换之后(看末尾逻辑)一、主要代码封装/* * @Author: gjw * @Date: 2020-07-30 16:09:32 * @LastEditTime: 2020-07-30.原创 2020-08-03 20:06:37 · 1148 阅读 · 0 评论 -
TypeScript中集成Tween.js踩坑
首选,采用的是webpack的架构,在ts中使用tween.js,非常麻烦,配置教程少的可怜,浪费了我一个下午,在这里记录一下,往有缘人别踩坑。tween.js版本为18.6.0一、安装npm i @tweenjs/tween.jsNote:必须这么安装二、更改配置原配置:更改为:Note:将’='改为default三、引用import * as TWEEN from '@tweenjs/tween.js';Note:调用tween.start(undefined)或者TWEEN.原创 2020-07-28 20:47:40 · 2258 阅读 · 0 评论 -
关于Three.js实现智慧城市我实现的一些特效
1、OD线(着色器实现)2、透明墙3、地面扩散粒子4、地震波5、发光扩散半球6、发光旋转四棱锥7、流动线8、上升粒子9、建筑线框10、圆扩散11、建筑物纹理流动12、建筑流动着色器版本13、粒子地面...原创 2020-07-24 18:05:19 · 17813 阅读 · 37 评论 -
关于对数深度的一些知识
这些知识忘了在哪粘贴的,希望原作者看到可以留言OpenGL渲染时,顶点着色器输出的w值为是W = -Z;而深度值是 D = Z * ( n + f ) / ( n - f ) + 2.0 * f * n / (n-f)顶点着色器中的值通过除以w转换为归一化的设备坐标,因此深度值变成了:Dndc=D / W = D / -Z = -D / Z = (f+n)/(f-n) + 2.0 *f*n/(f-n) / Z;让 a = 2.0 *f*n/(f-n) ; b = (f+翻译 2020-06-18 20:41:23 · 1110 阅读 · 0 评论 -
关于three.js的WebGLRender源码解析(待补充)
最近这半年一直在整毕业的事情,这个毕业真的支配了我三年,说实在我这个硕士确实有点水,我本身测绘工程出身的,研究生选的三维可视化方向,毕业论文却写的遥感方向,找的工作又是三维开发,兜兜转转又回到了原点,这一切应该就是所谓的缘分,最近看了一些three.js的源码,与cesium的源码的相比three的源码通俗易懂,前提你对webgl熟悉,准备用业余时间写一套基于webgl底层的自己的三维引擎。先写一点关于three的WebGLRender基本渲染东西后续的再次补充。一、两个重要的渲染函数1、renderB原创 2020-06-18 20:36:19 · 721 阅读 · 1 评论