three.js

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

【ThreeJS急诊室】一个生产事故：我把客户的工厂渲染“透明”了事情是这样的。上周五下午，我美滋滋地喝着咖啡，心想智慧工厂项目一期终于交付了，周末能躺平打游戏。结果快下班时，企业微信狂震 —— 客户发来一段视频：

爱看书的小沐

【小沐杂货铺】基于Three.js渲染三维无人机Drone（WebGL / vue / react ）https://threejs.org/Three.js 是一个基于 WebGL 的开源 JavaScript 库，用于在浏览器中创建和展示 3D 图形。它由 Ricardo Cabello（也称为 Mr.doob）于 2010 年创建，旨在简化 WebGL 的复杂性，使开发者能够轻松创建 3D 场景和交互式内容。

【ThreeJS实战】5个让我帧率翻倍的小技巧，不用改模型前言：最近项目优化进入瓶颈，模型不想动（或者动不了），但帧率就是上不去。正当我准备上Blender、搞重型优化的时候，老大扔过来一句话："先改代码，5分钟见效的那种。"我将信将疑试了试，好家伙，帧率从30fps直接干到60fps，GPU占用从100%降到60%，而且一行模型都没改！今天就把这5个代码小技巧分享出来，每个技巧的前因后果都讲清楚，看完立刻就能用。

学习Three.js–柱状图基于Three.js实现ECharts标准风格的3D柱状图，还原ECharts的视觉特征（配色、标签样式、坐标轴风格），同时具备3D场景的交互性与真实光影效果，核心能力包括：

初次攀爬者

学习Three.js--柱状图基于Three.js实现ECharts标准风格的3D柱状图，还原ECharts的视觉特征（配色、标签样式、坐标轴风格），同时具备3D场景的交互性与真实光影效果，核心能力包括：

【ThreeJS实战】从86MB到4MB：复杂模型加载优化黑魔法前言：正当我沉浸在将draw call从52000优化到1的喜悦中无法自拔时，产品经理这时候又杀过来了："客户说模型加载要30秒，还没进去就关页面了，你优化一下？"我打开Network面板一看，卧槽，86MB的GLB文件！这谁顶得住啊...

学习Three.js–雪花基于Three.js的粒子系统+自定义着色器实现真实感3D雪花飘落效果，还原雪花的自然视觉与动态特征，核心能力包括：

学习Three.js–风车星系基于Three.js的粒子系统+自定义着色器实现真实感M101风车星系效果，还原星系的核心结构与视觉特征，核心能力包括：

学习Three.js–星环粒子（ShaderMaterial）基于Three.js的ShaderMaterial实现高性能10万粒子纯净白色星环效果，核心能力包括：

学习：threejs案例—大屏3D地图可视化vue3threejs创建twin文件夹CreateTwin.jstwin.jsApp.vuepublic放入工厂.glb

学习Three.js–基于GeoJSON绘制2D矢量地图基于Three.js实现纯矢量2D地图，核心能力包括：初始化场景/正交相机/渲染器实现墨卡托投影函数加载GeoJSON数据

学习Three.js–太阳系星球自转公转基于Three.js实现高还原度的太阳系演示场景，核心包含：首先导入Three.js核心及扩展模块（轨道控制器、GLTF加载器、后期处理）：

学习Three.js–纹理贴图(Texture)纹理贴图是 Three.js 中让3D模型呈现真实外观的核心手段，本质是将2D图片（纹理）「贴」到3D几何体表面，替代单一的纯色材质，实现照片级的视觉效果（如墙面纹理、地面瓷砖、金属质感、木纹等）。

学习Three.js--光源Light+轨道控制器OrbitControlsThree.js 的 3D 世界默认处于全黑状态，想要让「受光照影响的材质」显示出真实的光影效果，必须手动添加光源；而轨道控制器（OrbitControls）是 Three.js 官方提供的核心交互插件，能让你通过鼠标/触摸自由操控相机视角，是 3D 场景交互的标配。

学习： Threejs （17）17.动画库tween.js | Three.js中文网tweenjs/tween.js: JavaScript/TypeScript animation engine

学习： Threejs （15）& Threejs （16）model.jsmodel.jsindex.jscss2Renderer.domElement在下，threejs canvas画布在上，标签被canvas画布遮挡，看不到标签。

学习Three.js–材质(Material)以下参数适用于 90% 的材质（MeshBasic/MeshLambert/MeshPhong/Standard/Physical 全部包含），一次记忆，全部受用！

答案—answer

开源项目：Three.js3D模型可视化编辑系统如果你正在学习Three.js,又或者说想使用Three.js开发一个企业级的3D项目，那么threejs-3dmodel-edit 这个项目一定值得你去探索和学习

贝格前端工场

困在像素里：我的可视化大屏项目与前端价值觉醒去年春天，我差点毁掉一个两百多万的单子。不是因为代码bug，而是当客户指着我们精心打磨的实时数据大屏问“所以，这能告诉我下周该增产还是减产？”时，我和我的团队，哑口无言。