- 博客(11)
- 收藏
- 关注
RSS订阅
原创 Three.js基础入门介绍——【毕业季】Three.js动态相册
岁月匆匆，又是一年毕业季，这次做个动态相册展示图片，放些有意思的内容，一起回忆下校园生活吧。
2024-03-22 13:25:22
969
1
原创 Three.js基础入门介绍——Three.js学习七【播放模型动画时模型沿着轨迹移动】
three.js-master：为官网下载的代码包，包含所有需要用到的资源包，链接：https://github.com/mrdoob/three.js/archive/master.zip。模型使用的是官方示例中的Soldier模型，文件位置：three.js-master\examples\models\gltf\Soldier.glb。路径：用到了Three.js提供的CatmullRomCurve3：使用Catmull-Rom算法， 从一系列的点创建一条平滑的三维样条曲线。2、添加模型和播放动画。
2024-03-15 20:40:36
973
1
原创 Three.js基础入门介绍——Three.js学习六【模型动画】
animationClip.findByName ( objectOrClipArray : Object, name : String ) : AnimationClip ——根据名称搜索动画剪辑(AnimationClip), 接收一个动画剪辑数组或者一个包含名为"animation"的数组的网格（或几何体）作为第一个参数。onLoad的参数将是一个包含有已加载部分的Object：.scene、 .scenes、 .cameras、 .animations 和 .asset。
2024-01-16 13:26:40
1187
1
原创 Three.js基础入门介绍——Three.js学习五【让模型沿着轨迹移动】
模型使用的是官方示例中的Soldier模型，文件位置：three.js-master\examples\models\gltf\Soldier.glb。用到了Three.js提供的CatmullRomCurve3：使用Catmull-Rom算法， 从一系列的点创建一条平滑的三维样条曲线。为了方便操作我们将文件拷出来放在上图static\3dmod\gltf文件夹下，static与three.js-master同级。这里是添加了几个辅助对象，方便找到光照和场景坐标位置。这里我们直接导入模型，在。
2024-01-09 14:24:55
2221
1
原创 Three.js基础入门介绍——Three.js学习四【模型导入】
加载器（GLTFLoader）为例进行模型导入操作，模型使用的是官方示例中的Soldier模型，文件位置：three.js-master\examples\models\gltf\Soldier.glb。通过建模工具或者模型素材网站获取，学习用的话官网的模型也是可以使用的，在官方示例文件夹中有很多模型文件目录：three.js-master\examples\models。通过Three.js的材质和几何体，我们可以很方便的创建基础3D模型，但涉及到复杂模型时，一般是由专业建模工具。
2023-12-26 21:08:00
2148
1
原创 Three.js基础入门介绍——Three.js学习三【借助控制器操作相机】
使用构建工具与打包器的开发者更喜欢仅使用单独的包说明符（如’three’）而非相对路径，而examples/目录中的文件使用相对于 three.module.js 的引用并不符合这一期望。three.js的核心专注于3D引擎最重要的组件。这些组件和 three.js 的核心保持同步，而 npm 上类似的第三方包则由不同的作者进行维护，可能不是最新的。其一：在script标签中，默认不能使用module形式，不能使用import导入文件，我们需要在script标签上添加加 type=module 属性；
2023-12-23 09:08:06
1095
1
原创 Three.js基础入门介绍——Three.js学习二【极简入门】
比如说，我们可以使用所需要的渲染区域的宽高，来让渲染器渲染出的场景填充满我们的应用程序。对于性能比较敏感的应用程序来说，你可以使用setSize传入一个较小的值，例如window.innerWidth/2和window.innerHeight/2，这将使得应用程序在渲染时，以一半的长宽尺寸渲染场景。接下来，对于这个立方体，我们需要给它一个材质，来让它有颜色。如果你希望保持你的应用程序的尺寸，但是以较低的分辨率来渲染，你可以在调用setSize时，将updateStyle（第三个参数）设为false。
2023-12-19 09:15:33
3409
1
原创 Three.js基础入门介绍——Three.js学习一【学习路线】
1.深入了解Three.js前提下需要知道：【OpenGL和WebGL】1. OpenGL是一个跨平台的3D/2D的绘图标准（规范）。OpenGL是开放式图形标准，跨编程语言、跨平台，Javascript、Java 、C、C++ 、 python 等都能支持OpenGL ，OpenGL的Javascript实现就是WebGL。OpenGL ES 2.0是OpenGL的子集，针对手机、游戏主机等嵌入式设备而设计。2. WebGL（Web Graphics Library）是一种3D绘图协议。
2023-12-12 18:54:20
3189
原创 Vue2/3中的响应式原理
通过Proxy（代理）: 拦截对象中任意属性的变化, 包括：属性值的读写、属性的添加、属性的删除等。通过Reflect（反射）: 对源对象的属性进行操作。
2024-04-29 23:53:57
920
原创 nvm的简介、安装、使用
nvm是一个node的版本管理工具，可以简单操作node版本的切换、安装、查看。等等，与npm不同的是，npm是依赖包的管理工具。如果电脑上之前已经单独安装了node，先卸载，然后解压nvm-setup.zip安装包，进入解压的文件夹，双击exe后缀文件进行安装。下面这个界面是选择安装nvm的路径，自己可以更改安装路径，一般默认路径。如果安装到D盘，则需要配置相对应的环境，如图：（输入相对应的文件位置）安装完毕后，找到安装的路径，一些简单配置，打开setting.txt。4.安装所对应的版本。
2024-04-25 05:44:42
1653
1
原创 WebSocket项目中难点与解决方法
WebSocket在性能和未来扩展性方面存在挑战，我们面临着消息传输的大小、并发连接数以及处理大量消息的问题。在项目中，我们发现WebSocket初始连接负担较大，主要体现在频繁的连接建立和保持连接的开销较高。面对网络不稳定和连接断开的情况，我们需要有效地处理错误，并保证用户体验的连贯性。
2024-01-02 08:23:57
4852
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人