当前位置：首页 > news >正文

Three.js 系列专题 5：加载外部模型

news 来源：原创 2025/8/24 4:00:41

内容概述

Three.js 支持加载多种 3D 文件格式（如 GLTF、OBJ、FBX），这让开发者可以直接使用专业建模软件（如 Blender、Maya）创建的复杂模型。本专题将重点介绍 GLTF 格式的加载，并调整模型的位置和材质。

学习目标

理解常见 3D 文件格式及其特点。
掌握使用 GLTFLoader 加载外部模型。
学会调整加载模型的属性（如位置、大小、材质）。

完整代码实现

我们将加载一个 GLTF 格式的狐狸模型（来自 Three.js 官方示例），并让它在场景中旋转。

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Three.js - 加载外部模型</title><style>body { margin: 0; overflow: hidden; }canvas { display: block; }</style>
</head>
<body><!-- 引入 Three.js 和 GLTFLoader --><script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></script><script src="https://threejs.org/examples/js/loaders/GLTFLoader.js"></script><script>// 1. 初始化场景、相机和渲染器const scene = new THREE.Scene();const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);camera.position.set(0, 2, 5);camera.lookAt(0, 0, 0);const renderer = new THREE.WebGLRenderer();renderer.setSize(window.innerWidth, window.innerHeight);document.body.appendChild(renderer.domElement);// 2. 添加光源const ambientLight = new THREE.AmbientLight

Three.js 系列专题 5：加载外部模型

内容概述 Three.js 支持加载多种 3D 文件格式（如 GLTF、OBJ、FBX），这让开发者可以直接使用专业建模软件（如 Blender、Maya）创建的复杂模型。本专题将重点介绍 GLTF 格式的加载，并调整模型的位置和材质。学习目标理解常见 3D 文件格式及其特点。掌握使用 GLTFLoader 加…...

编程日记 2025/8/24 4:00:41

【C++算法】50.分治_归并_翻转对

文章目录题目链接：题目描述：解法C 算法代码：图解题目链接： 493. 翻转对题目描述： 解法分治策略一：计算当前元素cur1后面，有多少元素的两倍比我cur1小（降序） 利用单…...

编程日记 2025/8/21 12:17:41

观察者模式详解实战

观察者模式深度解析与实战案例一、传统观察者模式痛点分析强制接收所有通知：观察者被迫处理无关事件事件信息不透明：状态变更缺乏上下文信息类型安全缺失：需要手动进行类型判断和转换扩展成本高：新增事件类型需要修改接口 …...

编程日记 2025/8/20 10:23:24

Light RPC：一款轻量高效的Java RPC框架实践指南

Light RPC：一款轻量高效的Java RPC框架实践指南一、框架简介二、快速入门1. 环境准备2. 服务端配置2.1 添加依赖2.2 YAML配置2.3 接口与实现 3. 客户端配置3.1 添加依赖3.2 YAML配置3.3 客户端调用三、核心设计解析四、适用场景与优势对比五、总结一、框架简介 …...

编程日记 2025/8/24 3:56:37

国内MCP资源网站有哪些？MCP工具上哪找？

在人工智能领域，MCP（模型上下文协议）正逐渐成为连接 AI 模型与外部世界的重要桥梁。而AIbase （https://www.aibase.com/zh/repos/topic/mcp）正是探索 MCP 生态的绝佳平台，它为开发者和研究者提供了一个集中…...

编程日记 2025/8/23 1:51:39

在PowerBI中通过比较日期实现累加计算

#表格数据# 日期数量2025/4/712025/4/822025/4/932025/4/1042025/4/1152025/4/1262025/4/1372025/4/1482025/4/1592025/4/16102025/4/1711 #新建计算列# 列 SUMX(FILTER(表格数据,[日期]<EARLIER([日期])),表格数据[数量])...

编程日记 2025/8/22 1:47:03

十四届蓝桥杯Java省赛 B组(持续更新..)

十四届蓝桥杯Java省赛 B组第一题：阶乘求和 📖 📚阶乘求和第二题：幸运数字 📖 📚幸运数字第三题：数组分割 📖 📚数组分割说是考动态规划，但没有用…...

编程日记 2025/8/24 3:55:42

NO.73十六届蓝桥杯备战|搜索算法-剪枝与优化-记忆化搜索|数的划分|小猫爬山|斐波那契数|Function|天下第一|滑雪(C++)

剪枝与优化剪枝，形象得看，就是剪掉搜索树的分⽀，从⽽减⼩搜索树的规模，排除掉搜索树中没有必要的分⽀，优化时间复杂度。在深度优先遍历中，有⼏种常⻅的剪枝⽅法排除等效冗余如果在搜索过程中&#xf…...

编程日记 2025/8/24 3:52:13

深度学习总结（2）

神经网络的数据表示在前面的例子中，我们的数据存储在多维NumPy数组中，也叫作张量（tensor）。一般来说，目前所有机器学习系统都使用张量作为基本数据结构。张量对这个领域非常重要，重要到TensorFlow都以它来命名。究竟什么是张量呢？张量这一概念的核心在于，它是一个数…...

编程日记 2025/8/24 3:56:36

STM32H7 ADC最大速率

STM32H7 ADC最大速率硬件限制封装在手册 AN5354 中说明了不同封装、不同分辨率的最大速率是不一致的； BGA封装的ADC的速度要快于LQFP封装的速度的； 分辨位数越高、转换时间越长，所以ADC的最大采样速率也就最低； ADC通道模…...

编程日记 2025/8/24 3:32:15

MVC模型

MVC模型（Model模型，View视图，Controller控制器） 逻辑执行流程： JSP（View）----》Servlet（Controller）----》service，dao，pojo（Model&a…...

编程日记 2025/8/24 3:54:29

OpenGL ES -＞ SurfaceView + EGL实现立方体纹理贴图+透视效果

XML文件 <?xml version"1.0" encoding"utf-8"?> <com.example.myapplication.MySurfaceView xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"…...

编程日记 2025/8/19 10:20:24

arthas线上不停机修改bug

安装arthas wget https://alibaba.github.io/arthas/arthas-boot.jar启动： java -jar arthas-boot.jar 启动失败使用jps也没查到对应的进程发生错误信息使用进程id启动，报错进程id查看使用命令： ps -ef | grep java 详情&#xf…...

编程日记 2025/8/24 3:59:02

#关于require 与 import 相关了解

📦 require 在前端项目中使用，属于 CommonJS 模块规范的语法，主要用于 Node.js 环境。早期的前端模块打包工具（如 Webpack）会兼容这种写法，但在现代前端项目（如 Vue、React）中&…...

编程日记 2025/8/22 21:13:23

【算法应用】基于融合A星-粒子群算法求解六边形栅格地图路径规划

目录 1.粒子群算法PSO原理2.结果展示3.参考文献4.代码获取 1.粒子群算法PSO原理【智能算法】粒子群算法（PSO）原理及实现六边形栅格地图分析一下地图： 六边形栅格地图上移动可以看做6领域运动，偶数列与奇数列移动方式有所差异…...

编程日记 2025/8/24 3:58:31

【深度学习】【目标检测】【Ultralytics-YOLO系列】YOLOV3源码整体结构解析

【深度学习】【目标检测】【Ultralytics-YOLO系列】YOLOV3源码整体结构解析文章目录【深度学习】【目标检测】【Ultralytics-YOLO系列】YOLOV3源码整体结构解析前言代码结构整体data文件结构模型训练超参数配置文件解析数据集配置文件解析 models文件结构utils文件结构runs文…...

编程日记 2025/8/24 3:58:03

R语言：气象水文领域的数据分析与绘图利器

R 语言是一门由统计学家开发的用于统计计算和作图的语言（a Statistic Language developed for Statistic by Statistician），由 S 语言发展而来，以统计分析功能见长。R 软件是一款集成了数据操作、统计和可视化功能的优秀的开源软…...

编程日记 2025/8/24 3:59:03

R语言空间水文气象数据分析：从插值到动态可视化

一、R简介与R 在气象水文中的应用 R语言与 R软件简介R 在各行业的应用概览R 与其他语言的比较及其在数据分析与作图上的优势 R 在地学中的应用以及R 在气象水文中的应用二、出发之前——用什么来同时记录我们的数据、代码及结果——Rmd与 knitr介绍介绍一种方便的理念——…...

编程日记 2025/8/24 1:31:08

在Unity中实现《幽灵行者》风格的跑酷动作

基础设置角色控制器选择： 使用Character Controller组件或Rigidbody Capsule Collider 推荐使用Character Controller以获得更精确的运动控制输入系统： 使用Unity的新输入系统(Input System Package)处理玩家输入滑铲实现 public class Slide…...

编程日记 2025/8/21 4:32:19

C# Winform 入门（14）之如何使用线程池

什么是线程？ 首先我们要弄明白什么是线程，线程和线程池有啥区别？ C# 多线程应用(同步异步)_c# 异步线程-CSDN博客补充：ManualResetEvent 的使用 ManualResetEvent 是一种线程同步机制，用于控制一个或者多个线程的执…...

编程日记 2025/8/24 4:00:14

I have something to say about Vue Node.js

关于Vue Node.js，我真的说了很多次了，让我难以理解为啥这么粗糙的东西能流行一起。真疯狂的世界。 vue让感觉就像玩猫德一样的，如此的疯狂，天哪。睡觉了 Node.js v13 window7_nodejsv13-CSDN博客...

编程日记 2025/8/23 15:09:00

OpenCV 图形API（17）计算输入矩阵 src 中每个元素的平方根函数sqrt()

操作系统：ubuntu22.04 OpenCV版本：OpenCV4.9 IDE:Visual Studio Code 编程语言：C11 描述计算数组元素的平方根。 cv::gapi::sqrt 函数计算每个输入数组元素的平方根。对于多通道数组，每个通道会独立处理。其精度大约与内置的 …...

编程日记 2025/8/24 3:56:14

题目练习之set的奇妙使用

♥♥♥~~~~~~欢迎光临知星小度博客空间~~~~~~♥♥♥ ♥♥♥零星地变得优秀~也能拼凑出星河~♥♥♥ ♥♥♥我们一起努力成为更好的自己~♥♥♥ ♥♥♥如果这一篇博客对你有帮助~别忘了点赞分享哦~♥♥♥ ♥♥♥如果有什么问题可以评论区留言或者私信我哦~♥♥♥ ✨✨✨✨✨✨ 个…...

编程日记 2025/8/24 3:58:29

基于人工智能的医学影像关联分析：利用潜在空间几何混杂因素校正法|文献速递-深度学习医疗AI最新文献

Title 题目 AI-based association analysis for medical imaging using latent-spacegeometric confounder correction 基于人工智能的医学影像关联分析：利用潜在空间几何混杂因素校正法 01 文献速递介绍人工智能（AI）已成为各个领域的…...

编程日记 2025/8/24 3:56:36

进程的创建态、运行状态和阻塞状态

今天与大家来聊聊进程的三种状态： 1. 创建态当需要创建一个新进程时，系统为该进程分配一个进程控制块 PCB，并为该进程分配内存空间，且装入该进程对应的程序和有关的数据，这时，一个新进程就产生了。 2. …...

编程日记 2025/8/24 3:58:30

科普：GRU、LSTM及RNN

GRU（门控循环单元）、LSTM（长短期记忆网络）、RNN（循环神经网络）均为处理序列数据的神经网络模型，它们之间存在着紧密的联系与明显的差异。我们重点看一下GRU，并比较它们。一、GRU算…...

编程日记 2025/8/22 6:10:12

java+postgresql+swagger-多表关联insert操作(七)

入参为json，然后根据需要对多张表进行操作： 入参格式： [{"custstoreName":"swagger-测试经销商01","customerName":"swagger-测试客户01","propertyNo":"swaggertest01",&quo…...

编程日记 2025/8/24 3:58:30

如何将/dev/ubuntu-vg/lv-data的空间扩展到/dev/ubuntu-vg/ubuntu-lv的空间上

要将 /dev/ubuntu-vg/lv-data 的空间扩展到 /dev/ubuntu-vg/ubuntu-lv 上，实际上是将 lv-data 的空间释放出来，并将其分配给 ubuntu-lv。以下是详细的步骤和操作说明： 已知信息你有两个逻辑卷： /dev/ubuntu-vg/lv-data/dev/ubun…...

编程日记 2025/8/17 22:12:53

No module named ‘keras.engine‘

目录报错代码： tensorflow-gpu安装 2024.01.05 keras和tf版本对应关系： 报错代码： try:from keras.src.engine import base_layer, data_adapterfrom keras.src.engine.training import _disallow_inside_tf_function, _get_verbosity, …...

编程日记 2025/8/24 3:56:37

python应用之使用pdfplumber 解析pdf文件内容

目录标题 1. 通过 pdfplumber.open() 解析复杂PDF：1-2. 报错：V2 ： v3 使用tk 库运行环境准备完整代码保存运行测试步骤方式二：命令行方式（适用于自动化） 测试用例示例常见问题排查1. 无文件选择对话框弹出&…...

编程日记 2025/8/23 7:54:08

【学Rust写CAD】36 颜色插值函数(alpha256.rs补充方法）

源码 pub fn alpha_lerp(self,src: Argb, dst: Argb, clip: u32) -> Argb {self.alpha_mul_256(clip).lerp(src, dst)}这个函数 alpha_lerp 是一个颜色插值（线性插值，lerp）函数，它结合了透明度混合（alpha_mul_256&…...

编程日记 2025/8/23 5:09:20

[GN] 通讯协议 - Uart

系列文章目录 sigrokdecode 模块学习指南 — 准备阶段文章目录系列文章目录前言通讯协议Uart通讯协议什么是UartUART通信协议其他协议后续待更前言在阅读libsigrokdecode源码之前，先学习通讯协议。so hard！！ 通讯协议 Uart通讯协议 …...

编程日记 2025/8/17 22:12:50

C# 状态模式深度解析：构建灵活的状态驱动系统

一、状态模式概述状态模式（State Pattern）是一种行为型设计模式，它允许对象在其内部状态改变时改变其行为，使对象看起来像是修改了它的类。这种模式将特定状态相关的行为局部化，并且将不同状态的行为分割开来。状态…...

编程日记 2025/8/20 8:04:55

MySQL学习笔记四

第六章过滤数据 6.1使用WHERE子句输入： SELECT job_id, job_title FROM jobs WHERE min_salary4200; 输出： 说明：在需要特定数据时需要根据条件对数据库中的数据进行过滤，即指定搜索条件（过滤条件）&a…...

编程日记 2025/8/24 3:59:03

Node环境安装

1.下载安装作为开发使用，追求长期运行的Node环境，建议选择LTS版本(长期支持稳定版)，本地测试可以选择最新版本。首先，访问Node.js官网下载安装程序，好在官网默认就有下载链接： 直接点击下载即可&#xff…...

编程日记 2025/8/19 16:14:41

浏览器自动化操作AI工具-browser-use

一、项目概述 Browser-Use 是一个将大型语言模型（LLM）与浏览器自动化结合的开源工具，旨在通过AI代理实现智能化的网页交互操作。其核心目标是为开发者提供一种无需编写复杂脚本即可完成网页自动化任务的解决方案，支持从数据抓取到…...

编程日记 2025/8/24 3:53:30

极氪汽车云原生架构落地实践

云原生架构落地实践的背景随着极氪数字业务的飞速发展，背后的 IT 技术也在不断更新迭代。极氪极为重视客户对服务的体验，并将系统稳定性、业务功能的迭代效率、问题的快速定位和解决视为构建核心竞争力的基石。为快速响应用户的需求，例如…...

编程日记 2025/8/19 5:04:34

[ctfshow web入门] web16

信息收集提示：对于测试用的探针，使用完毕后要及时删除，可能会造成信息泄露试试url/phpinfo.php url/phpsysinfo.php url/tz.php tz.php能用点击phpinfo，查看phpinfo信息，搜索flag，发现flag被保存为变量…...

编程日记 2025/8/17 22:12:54

沧州铁狮子

又名“镇海吼”，是中国现存年代最久、形体最大的铸铁狮子，具有深厚的历史文化底蕴和独特的艺术价值。以下是关于沧州铁狮子的详细介绍： 历史背景 • 铸造年代：沧州铁狮子铸造于后周广顺三年（953年）&#…...

编程日记 2025/8/22 20:08:56

【Android Sdk】uiautomatorviewer.bats闪退问题如何解决？

目录一、uiautomatorviewer.bats闪退 1. 报错场景 2. 问题原因 3. 解决方法前言具体操作一、uiautomatorviewer.bats闪退 1. 报错场景 SDK的tools文件夹中uiautomatorviewer.bat双击闪退不能打开，直接双击uiautomatorviewer.bat闪退。双击打不开uiaut…...

编程日记 2025/8/23 8:53:00

Redis7——进阶篇（八）

前言：此篇文章系本人学习过程中记录下来的笔记，里面难免会有不少欠缺的地方，诚心期待大家多多给予指教。基础篇： Redis（一）Redis（二）Redis（三）Redis&#x…...

编程日记 2025/8/19 19:33:31

蓝桥杯封闭图形个数刷题笔记

分析写一个node结构定义两个数一个存数值一个存图形个数分解每个输入的数的每一位为每个输入的数赋值一个封闭图形个数的值作为判断依据重写 cmp函数作为 sort的判断依据 #include<iostream> #include<bits/stdc.h> using namespace std; const int N…...

编程日记 2025/8/19 1:23:08

AI大模型底层技术——结合 Prompt Engineering 的 LoRA

目录 1. 结合 Prompt Engineering 的 LoRA？ (1) 定义 (2) 核心思想 2. 核心功能 3. 对比传统通用微调 4. 技术要素 (1) Prompt Engineering (2) LoRA 微调 (3) Prompt & LoRA 协同优化 5. 难点及解决 6. 技术路径 7. 具体技术实现 8. 应用场景 9. …...

编程日记 2025/8/21 18:05:19

7-Zip如何创建分卷压缩文件，进行分批压缩？

相信很多小伙伴在传输文件时会选择先压缩成7-Zip等压缩包后再传输，但如果压缩的文件过大大，传输速度就会很慢，或者上传压缩文件到云盘时也会受到文件大小的限制。要解决以上问题，我们可以把文件压缩成多个标准的压缩包&#xf…...

编程日记 2025/8/17 7:48:29

【蓝桥杯省赛】 02 包子凑数

题目描述小明想知道包子铺用给定的蒸笼规格能凑出多少种无法组成的包子数目。若无法组成的数目无限，输出 INF。输入格式第一行为整数 N N N（蒸笼种数）接下来 N N N 行每行一个整数 A i A_i Ai（每种蒸笼的包子数&#x…...

编程日记 2025/8/23 7:26:31

人工智能通识速览（Part3. 强化学习）

三、强化学习 1. 基本概念强化学习是机器学习中的一个重要领域，它涉及智能体（agent）如何在环境中采取一系列行动，以最大化累积奖励。以下是关于强化学习的详细介绍： 智能体：是一个能够感知环境并采取行动…...

编程日记 2025/8/23 5:09:31

深度解析LinkedList工作原理

引言在 Java 编程中，集合框架是处理数据存储和操作的强大工具。LinkedList 作为其中的重要成员，为我们提供了一种灵活的列表实现方式。与 ArrayList 基于数组的实现不同，LinkedList 采用链表结构，这使得它在某些操作上具有独特的…...

编程日记 2025/8/22 14:23:53

excel的逻辑类型函数（主要包括if、and、or、not、xor、iserror、iferror、true、false、ifs、ifna、switch）

目录 1. IF 函数2. AND 函数3. OR 函数4. NOT 函数5. XOR 函数6. ISERROR 函数7. IFERROR 函数8. TRUE 与 FALSE9. IFS 函数10. IFNA 函数11. SWITCH 函数 1. IF 函数功能： 根据指定条件判断结果，如果条件为 TRUE，则返回一个值；…...

编程日记 2025/8/20 16:55:50

数据驱动金融韧性升级，开启数据交换“新范式”：构建“实时、国产化强适配”的数据交换与共享平台

在金融行业，数据不只是“资产”，更是贯穿风控、合规、营销与运营的核心“生命线”。而在数字化加速与信创战略并行推进的当下，金融行业对于“实时数据流通”的需求从未如此迫切。面对业务复杂性提升、国产化替代加速，以及监管科…...

编程日记 2025/8/22 17:58:03

cpp自学 day20（文件操作）

基本概念程序运行时产生的数据都属于临时数据，程序一旦运行结束都会被释放通过文件可以将数据持久化 C中对文件操作需要包含头文件 <fstream> 文件类型分为两种： 文本文件 - 文件以文本的ASCII码形式存储在计算机中二进制文件 - 文件以文本的…...

编程日记 2025/8/20 17:16:09

内容概述

学习目标

完整代码实现

相关文章：