![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
知识学习
文章平均质量分 51
日常学习笔记
你的南瓜呀
前端小白,一起成长~
展开
-
javaScript高级程序设计(18)——动画与Canvas图形
javascript早期定时动画类似这样上述定时动画存在的问题:1. 定时时间需要足够短,才能让不同的动画类型都能平滑顺畅;但又要足够长,让浏览器来得及渲染出来。2. 无法准确知晓循环之间的延时。setInterval和setTimeout都不能保证时间精度,第二个参数的时间只能保证何时会把代码添加到浏览器的任务队列,如果任务队列前面还有其他任务,需要等这些任务执行完在执行,浏览器自身计时器的精度问题更是雪上加霜。一般计算机显示器的屏幕刷新率都是60Hz,基本上意味着每秒需要重绘60次。原创 2023-10-22 18:04:34 · 170 阅读 · 1 评论 -
小步学习——orientationchange和resize事件
orientationchange执行时机问题,触发orientationchange事件时,浏览器横竖屏状态已经发生改变,但是浏览器还没有更新宽高数据。原创 2023-10-19 11:38:56 · 320 阅读 · 0 评论 -
Three.js入门(四)——顶点UV坐标、纹理贴图
顶点UV坐标和顶点位置坐标是一一对应的,UV顶点坐标你可以根据需要在0~1之间任意设置,具体怎么设置,要看你想把图片的哪部分映射到Mesh的几何体表面上0, 0,0.5, 0,0.5, 0.5,0, 0.5,]);// 设置几何体attributes属性的位置normal属性//2个为一组,表示一个顶点的纹理坐标。原创 2023-10-16 18:02:25 · 464 阅读 · 1 评论 -
Three.js入门(三)——层级模型
场景对象scene构成的层级模型本身是一个树结构,场景对象层级模型的第一层,也就是树结构的根节点,一般来说网格模型Mesh、点模型Points、线模型Line是树结构的最外层叶子结点。构建层级模型的中间层一般都是通过Threejs的Group类来完成,Group类实例化的对象可以称为组对象Object3D本身就是表示模型节点,因此也可以作为中间层Threejs场景对象Scene、组对象Group都有一个子对象属性.children,通过该属性可以访问父对象的子对象,子对象属性.children。原创 2023-10-16 16:38:06 · 179 阅读 · 1 评论 -
Three.js入门(二)——模型对象、材质
向量:向量是在数学和物理中常用的概念,它表示具有大小和方向的量。在三维空间中,向量通常用一组有序的数字表示,表示为 (x, y, z)。这些数字分别表示向量在 x、y 和 z 轴上的分量。在计算机图形学和Three.js中,常用的向量表示使用三维向量类,例如。通过模型位置属性.position可以设置模型在场景Scene中的位置。模型位置.position的默认值是,表示坐标原点。属性.scale表示模型对象的xyz三个方向上的缩放比例,.scale的属性值是一个三维向量对象Vector3,默认值是。原创 2023-10-16 15:48:42 · 247 阅读 · 1 评论 -
Three.js入门(一)——几何体BufferGeometry
非常简单,你的眼睛(相机)对着三角形的一个面,如果三个顶点的顺序是逆时针方向,该面视为正面,如果三个顶点的顺序是顺时针方向,该面视为反面。使用网格模型Mesh渲染几何体geometry,就是几何体所有顶点坐标三个为一组,构成一个三角形,多组顶点构成多个三角形,就可以用来模拟表示物体的表面。法线:数学上的法线概念,比如一个平面,法线的就是改平面的垂线,如果是光滑曲面,一点的法线就是该点切面的法线。对于曲面而言,细分数越大,表面越光滑,但是三角形和顶点数量越多,渲染性能越差。原创 2023-10-16 12:10:54 · 644 阅读 · 1 评论 -
WebGL支持检测
虽然大多数现代浏览器都支持 WebGL,但仍然有一些旧版本或特定配置的浏览器可能不支持。因此,在使用 WebGL 功能之前,最好进行浏览器兼容性检测,并提供替代方案或友好的降级体验,以确保你的应用程序在不支持 WebGL 的情况下仍然能够正常运行。原创 2023-10-13 16:33:23 · 391 阅读 · 0 评论 -
Three.js快速入门
Three.js是一款基于原生WebGL封装通用Web 3D引擎,可运用小游戏、产品展示、物联网、数字孪生、智慧城市园区、机械、建筑、全景看房、GIS等各个领域。学习阶段,如果只是想查看效果。推荐vscode安装live-server插件,打开对应.html文件,右键点击。在学习WebGL和Three.js之前,请先掌握基本的web知识。原创 2023-10-13 16:08:22 · 45 阅读 · 0 评论