three.js

我的Three.js3D场景编辑器免费开源啦🎉🎉🎉哈喽各位佬，这里话不多说主要是给大家简单分享一下我的另一个开源项目 (ThreeFlow)，也是一个基于Three.js开发的3D编辑器类型的项目，如果你正在学习Three.js或者想使用Three.js开发一个企业级的项目那么非常推荐你去学习研究一下这个项目。

一拳不是超人

Three.js一起学-如何通过官方例子高效学习 Three.js？手把手带你“抄”出一个3D动画在之前的文章中有说过，我认为学习three.js最好的方法就是通过官网的例子去学习，在实践中练习。因为Three.js中api很多，没有系统的学习文档，因此我觉得通过例子去学习，使用到某个概念或者api在深入学习它，这是一个不错的学习方式。那么具体如何学习呢？

金三银四，一个面试官连连夸赞的个人网页技术分享不知道大家有没有同样的感觉：今年的 “金三银四”，似乎没有想象中那么热闹。尤其是前端岗位，不少公司都在收缩，机会明显少了很多。

金三银四，一个面试官连连夸赞的个人网页技术分享不知道大家有没有同样的感觉：今年的 “金三银四”，似乎没有想象中那么热闹。尤其是前端岗位，不少公司都在收缩，机会明显少了很多。

用 Three.js 写了一个《我的世界》，结果老外差点给我众筹做游戏？注意看，这个男人叫小帅，他莫名其妙地躺在你的关注列表里。“爷爷，你关注的掘友更新了！！！”距离上一次发文已经接近两个月。这段时间里，在群友们持续不断的催更下，我一边理直气壮地鸽着，一边反复安慰自己：

【Three.js 与 Shader】编写你的第一个自定义着色器，让模型拥有灵魂以前我觉得 Shader 是神仙才能看懂的东西，直到我发现它其实就是告诉 GPU“怎么画”的说明书。两年前我第一次接触 Shader，看了一篇教程，开头就是 gl_FragColor、varying、uniform 这些天书一样的词。我心想：这玩意儿是人写的吗？

2025–2026 Three.js 有哪些重要更新？Web 3D 正在进入 WebGPU 时代过去几年，Web 3D 技术一直在快速发展，而 Three.js 依然是 Web 端最主流的 3D 引擎之一。

【Three.js 粒子系统进阶】从1000到10万粒子，如何让画面既绚丽又流畅你以为粒子就是一堆小点点？不，粒子是无数个会发光的小精灵，关键是怎么让它们听你指挥，还不把电脑累趴下去年我做了一个星空效果，就是那种无数星星闪烁、偶尔有流星划过的背景。刚开始挺顺利，1000个粒子，帧率稳稳60。产品经理看了一眼：“不够震撼，再密一点。”

Three.js3D编辑器必备的相机视图插件分享一个非常实用的Three.js3D场景相机视图插件three-viewport-gizmo 一个专为 Three.js 打造的 UI 辅助组件。它在场景中生成一个交互式的“坐标轴操纵杆”（类似 Blender 或 Unity 右上角的控制器），用于指示空间方向并快速切换视角。

Three.js进阶：打造可交互的3D苏州地图，悬浮高亮与飞线动画实战在上一篇文章中，我们成功将苏州各区县的GeoJSON数据转换为了带有立体感和边缘高亮的3D地图(用 Three.js 和 D3 在 Vue 中打造 3D 苏州地图)。但一个静态的地图显然不能满足我们对交互体验的追求。今天，我们将在这个基础上进行一系列进阶优化，让地图“活”起来：

用 Three.js 和 D3 在 Vue 中打造 3D 苏州地图地理信息可视化一直是前端领域的热门话题。传统的 2D 地图已经无法满足我们对于视觉效果和交互体验的追求，而 3D 地图则可以提供更直观、更震撼的空间认知。本文将带你从零开始，在 Vue 项目中结合 Three.js 和 D3.js 的地理投影模块，将一个普通的 GeoJSON 文件转化为可交互的 3D 挤出地图，并支持旋转、缩放等操作。最终效果是一个具有立体感和边缘高亮的苏州各区地图。

Three.js多视口渲染：如何在一个屏幕上同时展示三个视角客户说：“我要一个监控大屏，左边看整体，中间看特写，右边看俯视图。” 我说：“行，加钱就行。”上次写了篇画中画，没想到反响还不错。评论区有人问：“能不能一个屏幕放三个视角？像监控室那种。”

【Three.js与WebGPU】下一代3D技术到底强在哪？第一次跑通WebGPU demo，我的3080终于笑了前阵子刷知乎，看到一个问题：“WebGPU 出来了，WebGL 是不是快死了？”

【Three.js后期处理】如何让你的场景拥有电影级调色同样是三个盒子，加了后期，就像好莱坞大片去年我做了一个项目，给一个科技公司做产品展示。模型是人家设计师精雕细琢的，灯光我也调了半天，自认为效果还不错。结果拿给客户一看，对方皱了皱眉：

【Three.js多相机渲染】如何在同一场景里实现“画中画”效果你以为一个场景只能有一个相机？太天真了上个月，产品经理拿着一个监控大屏的设计图来找我：“小叶，你看这个效果——主画面看整个车间，右下角有个小窗口专门盯着那台最关键的设备，实时放大，能不能做？”

一个非常实用的Three.js3D模型爆破💥和切割开源插件给大家分享一个非常实用Three.js3D模型爆破切割插件，这个插件能够使前端可以直接在浏览器中，对 3D 模型进行实时且物理效果真实的 “爆破”、“粉碎” 或 “切片” 处理。

【Three.js内存管理】那些你以为释放了，其实还在占着的资源你以为你 dispose 了，它就没了吗？Too young ~三个月前，我差点被一个 Bug 搞到怀疑人生。

Three.js 零基础入门：手把手打造交互式 3D 几何体展示系统在 3D 世界里，所有的表演都需要一个舞台。Three.js 遵循“三剑客”原则：场景、相机、渲染器。

【ThreeJS调试技巧】那些让 Bug 无所遁形的“脏套路”有些 Bug 不报错、不崩溃，就静静在那儿恶心你做 Web 3D 开发最头疼的是什么？不是编译报错，不是性能瓶颈，而是那种画面看起来不对劲，但代码没任何错误的视觉 Bug。