three.js

贵州数擎科技有限公司

雨滴特效的 Three.js 实现大家好！我是晓智，一位专注 Web3D、Shader、AI 方向的前端开发者。这里会持续分享 Three.js、WebGL、Shader 特效、AI 可视化等实战内容。如果你也热爱前沿技术，欢迎一起交流成长 🚀

郝学胜-神的一滴

中级OpenGL教程 005：为球体&平面注入法线灵魂中级OpenGL教程 005：为球体&平面注入法线灵魂在浩瀚的 3D 图形渲染宇宙中，法线（Normal）是连接模型与光影的核心桥梁🌌，它如同模型表面的 “方向指引者”，精准决定光线反射、明暗过渡，是实现真实质感渲染的绝对基石！今天我们就一步步拆解，如何优雅地将法线数据植入Sphere 球体与Plane 平面，完成光照渲染前的关键铺垫～

我胖虎不答应！！

Three.js开发思想笔记从“写 3D 动画”到“配置 GPU 流水线”的思维转变。Three.js 本质上是在向 WebGL 驱动程序提交空间变换指令集。

塔罗神谕：星月神域莱诺薇为您占卜命运不语，但会在牌面上留下痕迹。Tarot Oracle 是一个围绕“仪式感抽牌 + 视觉演出 + AI 解读”设计的 Web 应用。项目基于 Vite + React + TypeScript + Three.js 构建，内置完整塔罗牌素材，并接入 DeepSeek 生成结构化占卜结果。

耗时 2 小时！我复刻了全网超火的通透 3D 水晶球动效，Vue3+Three.js 做出高级视觉特效之前做的3D文本效果# 别再写死静态文字了！Vue3+Three.js 实现超酷3D流光旋转文字科技感拉满！【附完整源码】有兄弟表示效果太单一，其实那个效果能做的非常炫酷。

ThreeJS之GUI控制器上篇主要介绍了 three.js 的基础使用及配置，例如场景、相机、渲染器、轨道控制器、灯光等等；本篇主要介绍 GUI 控制器，方便调试模型属性，例如按钮事件、位置、颜色、线框模式等等

别再写死静态文字了！Vue3+Three.js 实现超酷3D流光旋转文字科技感拉满！【附完整源码】前一段时间搞了大量的 Cesium 的内容，现在公司这个部分的项目告一段落。但是又来了一个搞3D的项目，所以打算后面一段时间更新一下 ThreeJs 相关的内容，有兴趣的朋友可以关注一下。

爱看书的小沐

【小沐学WebGIS】基于Cesium.JS与jsbsim联动三维飞行仿真（OpenGL、Cesium.js、Three.js）JSBSim是 1996 年启动的开源、跨平台、C++ 编写的飞行动力学（FDM）库，核心为 ** 非线性六自由度（6DoF）** 飞行器运动求解，无内置图形界面，专注高精度物理仿真。

爱看书的小沐

【小沐杂货铺】基于Three.js绘制三维艺术画廊3DArtGallery （Three.js，WebGL）3DArtGallery 是基于 WebGL/OpenGL 的沉浸式三维艺术画廊系统，用于在线虚拟艺术展览与数字藏品展示。

郝学胜-神的一滴

[简化版 GAMES 101] 计算机图形学 07：图形学投影完全推导[简化版 GAMES 101] 计算机图形学 07：图形学投影完全推导在计算机图形学中，投影变换是连接 3D 世界与 2D 屏幕的唯一桥梁✨。正交投影（Orthographic）与透视投影（Perspective）是所有渲染、相机、视图系统的底层根基。本文严格依照经典图形学推导，完整复现矩阵由来，不跳步、不省略，带你一次吃透两种投影的数学本质。

CAE虚拟与现实

五一假期闲来无事，来个前段、后端的说明吧对于互联网上常提到的很多名词，例如容器化、微服务、前后端等，在工业信息化领域其实提及的相对要少一些，今天笔者通过一个简单的实例来阐述一下。

郝学胜-神的一滴

罗德里格斯旋转公式（Rodrigues‘ Rotation Formula）完整推导[简化版 GAMES 101] 计算机图形学加更：罗德里格斯旋转公式罗德里格斯公式是三维空间刚体运动学的核心，它巧妙地利用向量叉乘与点乘，将“绕任意单位向量 u \boldsymbol{u} u 旋转 θ \theta θ 角”的复杂空间操作降维求解。其最终的向量表达式为：

有了大屏设计稿还不够，我又用 gpt-image-2把里面的素材扒了出来上次写完用 AI 生成可视化大屏设计稿之后，评论区有人问：生成的图很好看，但怎么用？这个问题我知道大体思路——设计稿是整张图，得拆成一个个素材才能真正用起来。图标归图标，底板归底板，分开导出才能往代码里塞。

用户7893773390853

Vue3 + Three.js 仓储数字孪生：按需渲染架构与五大核心功能复盘在重构企业级 3D 仓储数字孪生项目的过程中，我摒弃了原项目过度封装的插件机制，转而采用 Vue 3 Composition API 结合 Three.js 原生 API 进行开发。

Three.js VR 模拟器（Immersive Web Emulator）踩坑全记录：从报错到可用，避坑指南一次性奉上最近在学习 Three.js VR 开发，本想通过 WebXR 模拟器快速调试场景，结果从安装到使用，踩了一个又一个坑——模拟器加载失败、点击 VR 按钮无反应、拖动头显视角不动、控制台报错不断，折腾一下午差点放弃。

THREE.JS实现一个魔法镜子！最近依然在学习THREE.JS发现了一个比较有意思的方法renderTarget，借助这个方法我们能实现很多有意思的效果

郝学胜-神的一滴

[简化版 Games 101] 计算机图形学 05：二维变换下[简化版 Games 101] 计算机图形学 05：二维变换下在计算机图形学、计算机视觉乃至几何运算的世界里，平移、旋转、缩放是我们处理空间坐标最基础的操作🎯。可你是否曾疑惑，为何简单的二维线性变换，却偏偏容不下平移操作？为何同样是二维的坐标，点和向量的表示要被区别对待？答案，就藏在齐次坐标这一精妙的数学设计里。它以“增一维”的微小代价，实现了所有几何仿射变换的矩阵化统一，让看似零散的空间操作，变成了规整的矩阵乘法运算，堪称几何变换领域的“化繁为简”神器💫。今天，我们就一起解锁齐次坐标的奥秘，读懂它如

Three.js 场景性能优化实战：首屏、帧率与内存的工程化治理在我之前的 Three.js 实战文章里，我们已经把“模型能加载”这个问题跑通了。真正上线后，难点往往不在功能，而在稳定性：首屏慢、偶发卡顿、内存持续上涨。

Three.js 模型加载稳定性实战：从资源失败到可用发布的工程化方案很多 Three.js 项目并不是卡在渲染性能，而是卡在“模型加载不稳定”：本地正常、线上 404、跨域报错、贴图丢失、首屏白屏。本文用 Vue3 + Vite + Three.js 搭建一个可运行示例，完整演示 glTF 资源组织、加载流程、错误兜底、进度反馈与发布前自检。你可以直接把这套流程迁移到业务项目，降低线上故障率与排查成本。

Three.js 材质完全入门指南：让你的 3D 物体「活」起来简单来说，材质定义了物体表面的视觉属性——颜色、光泽度、透明度、对光的反应方式等等。在 Three.js 中，材质是 Material 类的实例，它和几何体（Geometry）一起构成了网格（Mesh）：