自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

亦何妨的博客

学习webGL与three.js的小学生

  • 博客(19)
  • 收藏
  • 关注

原创 【渲染管线-1】坐标变换的理解

【渲染管线-1】坐标变换的理解1、对坐标变换的形象理解2、整个过程在计算机内的逻辑本文将尽可能细致的对坐标变换的过程,用意和一些细节进行剖析,目的是方便自己在遗忘时进行复习,因此可能会有些繁琐。文章将分成两部分,第一部分包含大量例子,主要用于对变换过程有一个形象的概念,不涉及具体内部计算,第二部分为真实计算逻辑,但隐去了计算的公式,有时间会补充第三部分即计算过程。1、对坐标变换的形象理解一个点,从三维空间到最终映射到屏幕上,它经历了一系列的坐标变换以及颜色的计算,这里只说坐标变换。举例,若你的桌子

2021-12-23 23:32:14 2949

原创 【cc3.x】顶点着色器和片元着色器小记

cc3.x(cocos creator3.x)的着色器demo有点少,而且讲的不是很清晰,我这种业余自学小白学的真的很艰难,不过好赖算是啃的差不多了,所以有了这则小记,权当备忘录了。首先顶点着色器,上一段代码:CCProgram vs %{ precision highp float; #include <particle-common> in vec3 a_position; // center position in vec4 a_color; in vec2 a_t

2021-12-13 20:27:28 3456

原创 【笔记】h5活动页制作流程总结

在公司制作的活动页通常包括各种测评活动,宣传单页,报名,信息收集等等,对接后端接口的需求较少,内容简单,难点主要在于自适应方案的选择和不同系统的兼容问题,下面大体梳理一下制作一个活动页需要考虑的几个方面。布局:通常活动页简单的用div区分不同的页面,再分情况展示即可,我的常用方法是,给每个页面一个<div class=“page”>,拿它当每一页的body,再在里面放一个<div class=“container”>作为页面的内容区域,page设置固定定位在0,0处,且默认v

2021-07-01 13:36:11 1596 1

原创 【笔记】前端开发,响应式与自适应布局总结

【笔记】前端开发,响应式与自适应布局总结1、不同平台使用uniapp做跨平台兼容,通常移动端的布局效果是统一的(无论是小程序还是H5移动端),但是h5的pc端一般会有新的布局需求,那么可以把页面的版块包装成一个个组件,在页面组件中仅给各个组件写布局,针对条件编译语句无法识别H5 PC的情况,就可以简单的用js在钩子函数中对布局做调整。2、不同系统不同系统下,比如ios和安卓下会有一些不兼容的情况,这个一般不涉及到针对不同系统的布局,但可能存在需要手写默认组件,来做到样式统一的效果,比如默认的vide

2021-06-29 11:47:08 1109

原创 【ES6-阮一峰博客阅读笔记】

let和const:let和const不会变量提升,因此如果在声明前使用,会报错阻止代码运行,此外var和function会变量提升,function在前,var在后,所以函数名和变量名重复的话,无论是以怎样的顺序定义的,变量都会覆盖函数。还有,这个使用会报错的使用,包括任何形式的使用,比如typeof 一个let声明的变量(在声明的那行代码前),那也会报错!但如果typeof一个压根不存在的变量,反而只会打印undefined,而不是报错。以及不能重复声明,let,const,var,函数参数名,.

2021-05-07 23:14:21 855

原创 【js中this,window,原型链,作用域链总结】

【记录一下这些概念的一些容易混淆的细节,不包含基本的概念讲解,只包含容易搞错的细节】一个函数只要是直接调用的,无论是在哪里直接调用,它的this都是window,因此,哪怕一个函数是嵌套在一个对象的函数的函数内返回的对象的函数内,无论套路多少,只要是直接调用的方式,那this就是window,因此访问不到其他任何不在window对象和局部作用域内的顺序,如下面的代码。 function father(){ this.name='a'; return {x:2, age:30,

2021-05-07 09:45:39 708

原创 【FirstPersonControls】2021-r126版three.js中FirstPersonControls类的源码学习

【FirstPersonControls】2021-r126版three.js中FirstPersonControls类的源码学习这里写目录标题【FirstPersonControls】2021-r126版three.js中FirstPersonControls类的源码学习1、构造函数2、属性2.1 布尔类型2.2 浮点型2.3 其他3、方法1、构造函数看下构造函数,传入参数有两个,第一个代表该控制器控制的相机,第二个代表渲染到的目标canvas元素。(源码里不止这点属性,先贴这一小块后面再分析属性,

2021-04-24 20:08:01 870

原创 【前端面试题总结-持续更新】

【只要看到新的js相关搞不懂的面试/笔试题就会来更新,写的比较简略,答案仅供参考,主要是整理下问题】重排和重绘:重排一定重绘,重绘不一定重排,重绘就是重新画一遍,重排是重新计算布局,如果只是改变了颜色则只重绘,影响到大小或位置则会重排,此外,添加/删除/获得大小,位置等相关的样式也会触发重排,因为重排不是立即生效的,会在某个时间节点生效,为了得到正确的样式,则会触发重排。频繁重排影响性能,所以需要频繁进行dom操作的节点可以脱离文档流(就不重排了),此外,不要生成一个节点添加一个,那样会触发n次重排,

2021-04-22 23:07:05 169 1

原创 【计组笔记-6】详细分析原码,反码,补码,以及移码

【计组笔记-3】原码,反码,补码及相关计算1. 定点数与浮点数1.1 定点数1.2 浮点数2. 无符号数与有符号数3. 原码,反码,补码3.1 原码1. 定点数与浮点数1.1 定点数1.2 浮点数2. 无符号数与有符号数通俗来讲,无符号数就是没有预留符号位的数,即所有的二进制位全部都是数值位,3. 原码,反码,补码3.1 原码...

2021-04-21 18:10:53 1579

原创 【计组笔记-5】详细测试c++中类型转换的溢出截断处理

【计组笔记-5】详细测试c++中类型转换的溢出截断处理1. 将小数赋值给float2. 将整数赋值给float3. 将整数赋值给int3.1 算术溢出3.2 非算术溢出(等于32位)3.3 非算术溢出(大于32位)4. 将小数赋值给int5. int和short互相转换6. double和float互相转换7. 总结注:测试环境是vs2019。会尽量把能想到的情况都测试&分析一下,有想不到的还望批评指正。1. 将小数赋值给float明天写(记得解释精度丢失)2. 将整数赋值给float

2021-04-20 21:21:32 1380

原创 【计组笔记-4】定点数,浮点数,IEEE 754标准,与常见数据类型

【计组笔记-4】定点数,浮点数,IEEE 754标准,与常见数据类型1. 定点数与浮点数介绍2. IEEE 754标准3. 浮点数介绍3.1 float3.1.1 float储存思路3.1.2 float中的指数位3.1.3 float中的数值位1. 定点数与浮点数介绍定点数,就是小数点固定的数,即在一个二进制数中,固定一部分代表整数,一部分代表小数。此外,小数点是隐式存在的,并不会有哪个二进制位专门空出来表示小数点。浮点数,顾名思义,就是小数点不固定的数。那么问题来了,定点数的点定在哪里,又如何记

2021-04-19 21:27:02 1537

原创 【计组笔记-3】基于c++分析无符号数与有符号数的计算区别(针对4字节整数)

【计组笔记-3】分析无符号数与有符号数的计算区别1. 无符号数与有符号数的定义2. 通过代码展示两者的区别3. 详细分析区别的产生原因3.1 无符号(unsigned)int型的最大值3.2 unsigned int最大值赋值给int的变化3.3 无符号与有符号类型对溢出的处理区别3.4 负数赋值给无符号类型的变化3.5 -0和+0的实际储存方式3.6 “-0”的真实数值3.7 有符号整数的-1,是无符号整数的最大值4. 总结1. 无符号数与有符号数的定义简单来讲,无符号数就是所有的二进制位都是数值位,

2021-04-18 23:12:08 1097

原创 【计组笔记-2】保姆级分析奇偶校验,海明校验,循环冗余校验

【计组笔记-2】奇偶校验,海明校验,循环冗余校验目录【计组笔记-2】奇偶校验,海明校验,循环冗余校验1.发生错误2.发现错误2.1 校验码2.2 合法状态与非法状态2.3 码距3.三种校验方式3.1 奇偶校验3.1.1 偶校验3.1.2 奇校验1.发生错误数据在传输过程中发生跳变,导致一个或若干位的数据由1变成0,或由0变成1。2.发现错误2.1 校验码校验码的引入,可辅助校验的进行,例如,规定一组二进制数按从左至右的顺序进行同或运算,得到的值作为校验码添加在最高位,并将添加了校验码的信息进行传

2021-04-12 23:12:59 291

原创 【计组笔记-1】ASCII码,区位码,国标码,汉字内码,以及万国码

【计组笔记-1】区位码,国标码,汉字内码,以及万国码在学习计组时,了解到区位码是用一个94x94的表格记录常用汉字与特殊字符,特殊字符中包含字母,数字,希腊字母,拼音,一些几何图标,箭头,书名号等等等等,链接如下:区位码百度百科但是其中并不包含控制字符或通信专用字符,即ASCII码中0~31的部分,因此,为了避免对这部分编号产生覆盖,要避开0-31的部分不对其进行编码,因此,国标码在区位码的基础上加了32,表示从32开始编码,这是我们国家对各种字符/文字等的编码方式。(这里补充下,ASCII是最早的编

2021-04-10 12:35:05 2219

原创 【Clock】2021-r126版three.js中Clock类的源码学习

【Clock】2021-r126版three.js中Clock类的源码学习目录【Clock】2021-r126版three.js中Clock类的源码学习1、构造函数2、方法3、应用1、构造函数看下构造器源码:function Clock(autoStart) { this.autoStart = autoStart !== undefined ? autoStart : true; this.startTime = 0; this.oldTime = 0; this.elap

2021-03-13 14:12:45 420

原创 【随笔】对变换矩阵的有趣理解

对矩阵变换的有趣理解由线性无关列向量组成的矩阵,可以理解为一种变换,而三个列向量,就是另一个空间(变换的目标空间)下的基,原空间内的点通过与这个矩阵相乘,就可以变换到由矩阵内三个列向量(基)张成的空间内的点(但坐标值还是基于原空间即世界坐标系来定的)。另一种简单的运算,如下图,在二维空间下,当基由i和j变换为绿色框框和红色框框表示的向量后,原空间内的向量的各个分量与对应的基相乘再相加,即为原向量变换(映射)到新空间后的新向量。三维也是一样的,即加了第三个基,也就是变换矩阵的第三列,而计算方法也可以参考

2021-03-10 18:30:14 456

原创 【Vector3】2021-r126版three.js中Vector3类的源码学习

超详细three.js中Vector3类的源码分析。对threejs中Vector3类中方法按功能进行了分类,并对所有方法与全部源码进行了详细解析,包括简介方法中应用的数学知识,以及分析其应用与功能。

2021-03-08 23:14:54 2540 6

原创 如何脱离数学推导理解欧拉角与万向节死锁

如何脱离数学推导理解欧拉角与万向节死锁目录如何脱离数学推导理解欧拉角与万向节死锁0、需要提前掌握的知识1、死锁的本质-旋转面重合的成因2、死锁出现将导致什么?-失控3、旋转面逐渐慢慢走向重合,这个过程是怎样的?4、补充知识4.1 欧拉角,旋转矩阵,四元数,以及它们的数学意义4.2 欧拉角换成旋转矩阵可以避免死锁吗?4.3 欧拉角适合决定姿态,但不一定适合计算插值5、写在最后先来总结【看完全篇再来看下这几行】:1、只有基于模型的旋转才会导致死锁。2、每一种旋转顺序只会出现一种死锁情况(即中间旋转90度

2021-03-08 14:40:30 1144 1

原创 【BufferAttribute】2021-r126版three.js中BufferGeometry类的使用学习

2021-r126版three.js中BufferAttribute的使用学习刚开始接触three.js,记录在这里免得自己忘记,欢迎萌新交流,以及跪求大佬指点!【写在最前面提醒自己和其他萌新:常见的网课大多很老了,目前发现还是看官方文档+结合官方给出的实例源码来自己琢磨更好些!网课可作为参考,一些代码的写法可能已经不适用了。】我的理解是,BufferGeometry是自由度最高的创建几何/几何体的方式,以前似乎有Geometry,但我在目前版本r126的官方文档(https://threejs.or

2021-03-06 23:40:22 1846

空空如也

空空如也

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

TA关注的人

提示
确定要删除当前文章?
取消 删除