博客zhu虎康
把最实用的经验,分享给最需要的读者,希望每一位来访的朋友都能有所收获!
展开
-
Threejs 入门
参考文档。原创 2024-07-11 09:51:36 · 335 阅读 · 0 评论 -
Threejs 展示——各种模型导入
这些仅是一些常见的模型文件格式后缀,Three.js还支持其他格式。需要注意的是,在使用这些格式导入模型之前,你需要确保Three.js库中包含对应的加载器。在Three.js中,你可以导入多种格式的模型文件。Three.js 中导入模型的时候可以导入哪些格式的数据。原创 2024-07-09 15:32:37 · 261 阅读 · 0 评论 -
Threejs API——获得场景中的所有对象
当我们需要对场景中的对象进行遍历时,可以使用traverse方法对场景对象及其子对象进行遍历。在遍历过程中,可以根据对象的类型标识符来判断该对象是否是Group类型,然后对其进行特定的操作。在遍历过程中,你可以根据对象的类型和属性来判断它们是什么,并进行相应的处理。在你的代码中,通过判断obj是否是网格模型(obj.isMesh),你可以对网格模型进行特定的操作,比如修改材质、添加动画等。通过判断对象是否具有isObject3D属性,我们可以确定该对象是否为Object3D类型的实例,从而进行特定的操作。原创 2024-01-31 11:14:06 · 113 阅读 · 0 评论 -
Threejs 展示——坐标间的转换
世界坐标系是指整个 Three.js 场景的坐标系,它是一个三维坐标系,用来表示场景中物体的位置和方向。屏幕坐标系是指屏幕或视口的二维坐标系,通常以左上角为原点,向右为 X 轴正方向,向下为 Y 轴正方向。当用户在屏幕上点击鼠标时,得到的坐标就是屏幕坐标系中的坐标。在 Three.js 中,展示和坐标间的转换涉及到不同的坐标系,包括世界坐标系、屏幕坐标系和相机坐标系。相机坐标系是相机的局部坐标系,它以相机位置为原点,相机视线方向为 Z 轴负方向,垂直向上为 Y 轴正方向,水平向右为 X 轴正方向。原创 2024-01-30 15:45:41 · 241 阅读 · 0 评论 -
Threejs 展示——点击模型指定部分添加高亮显示
如下图所示,点击模型指定部分添加高亮显示。原创 2024-01-30 14:17:49 · 426 阅读 · 0 评论 -
Threejs API——`OrbitControls`相机控件
【代码】Threejs API——`OrbitControls`相机控件。原创 2024-01-30 08:48:42 · 309 阅读 · 0 评论 -
Threejs 展示——fbx 格式模型导入
导入fbx 格式的模型数据。原创 2024-01-29 16:01:51 · 728 阅读 · 0 评论 -
Threejs 展示——glb 格式模型导入
导入skp 格式的模型数据。原创 2024-01-26 09:27:23 · 160 阅读 · 0 评论 -
Threejs 展示——skp 格式模型导入
导入skp 格式的模型数据。原创 2024-01-26 09:19:22 · 367 阅读 · 4 评论 -
Threejs 展示——obj 格式模型导入
需要注意的是,在加载模型文件之前,你需要确保OBJLoader加载器已经被引入。在本示例中,我们使用了CDN方式引入了Three.js和OBJLoader.js文件,你也可以通过其他方式进行引入。当然,也可以将代码放置到同一个文件中,避免多次引入。在该示例中,我们首先创建了基本的场景、相机和渲染器,并将其添加到页面中。接着,我们使用THREE.OBJLoader加载器加载模型文件。加载完成后,我们将其添加到场景中。导入obj 格式的模型数据。原创 2024-01-25 13:40:13 · 604 阅读 · 0 评论 -
Threejs 问题——模型引入后并未加载出来
目前测试 在 public/static/ 引入时不会发生此错误并渲染成功。如果没有此报错且模型没渲染出来, 可以尝试刷新标签页或者异步请求模型方法。Threejs 模型引入后并未加载出来。该问题是由于引入OBJ模型路径报错。原创 2024-01-25 13:32:55 · 697 阅读 · 0 评论