何贤因忙碌鸽了两个月，最近开发了一款基于Three.js和Vue的城建游戏《CubeCity》。游戏包含建造、选择、搬迁、拆除四种模式，通过Pinia管理元数据，Three.js呈现3D场景。项目虽为整活，但涉及复杂技术栈，未来或开专栏详解开发过程。何贤表示，后续将聚焦Three.js的视觉创意领域，而非深度游戏开发。开源虽好，但维护成本高，商业化仍是难题。

这篇教程教你如何将Blender中的布料模拟动画导出并嵌入Three.js项目，打造交互式网页效果。从Blender的基础操作开始，逐步讲解如何创建布料模拟、调整物理参数、导出动画数据，并在Three.js中加载和渲染。通过结合Blender的强大物理模拟和Three.js的交互性，最终实现一个点击触发的布料动画效果，适合想要提升3D交互设计能力的开发者。

本文教你如何用Three.js和GLSL实现水滴状球形效果。通过片段着色器，使用光线步进技术绘制球体，并利用smoothMin函数将多个球体平滑融合为metaball效果。接着，通过添加噪声模拟水滴纹理，最后让球体随鼠标移动产生弹性拉伸效果。整个过程从基础绘制到交互响应，逐步实现了一个生动的水滴效果。

本文深入解析了three.js中的阴影渲染机制，并提供了实用的优化技巧。通过调整阴影相机视野范围和优化阴影贴图分辨率，显著提升了阴影品质。同时，采用自定义shader生成地面阴影，降低性能损耗。这些方法在保证流畅运行的前提下，增强了3D网页应用的真实感与沉浸体验。

作为一个3D项目，为了提升首屏加载的转化率，需要尽可能的降低loading的时间。

炫酷的threejs勋章，你不想了解一下么？

在当今高度数字化的企业环境中，提高员工工作效率和满足内部需求至关重要。为了适应快速变化的企业要求，以及为公司伙伴提供更加智能、高效的工作体验，我们灵犀项目组决定启动一个内部AI智能助手项目，旨在提高工作效率、改善员工的工作体验。

web 3D炙手可热，本文将一步步带大家了解如何利用Three.js和Blender来打造一个沉浸式web 3D展览馆。

近期工作有涉及到数字大屏的需求，于是利用业余时间，结合 Three.js 和 CSS实现赛博朋克2077风格视觉效果 实现炫酷 3D 数字地球大屏页面。页面使用 React + Three.js + Echarts + stylus 技术栈，本文涉及到的主要知识点包括：THREE.Spherical 球体坐标系的应用、Shader 结合 TWEEN 实现飞线和冲击波动画效果、dat.GUI 调试工具库的使用、clip-path 创建不规则图形、Echarts 的基本使用方法、radial-gradient 创建雷达图形及动画、GlitchPass 添加故障风格后期、Raycaster 网格点击事件等。

在学习threejs过程中，涉及到各种各样的类和方法，比如Camera、Light、Mesh等等。对于初学者而言，遇到问题只知其然而不知其所以然，面对数量庞大且关联密切的类和方法往往会犯迷糊，所以深入的理清各个类之间的联系、继承关系，以及共用的方法变得尤为重要。基于此，本文将着重介绍threejs中的基础核心类之一—Object3D。

Learn how to create a complete color customizer app for a 3d model of a chair using Three.js in this in-depth tutorial.

逛 sketchfab 网站的时候我看到有很多二维平面转 3D 的模型例子，于是仿照他们的例子，使用 Three.js + React 技术栈，将二维漫画图片转化为三维视觉效果。本文包含的内容主要包括：THREE.Group 层级模型、MeshPhongMaterial 高光网格材质、正弦余弦函数 创建模型移动轨迹等。

虎年 ? 春节将至，本文使用 React + Three.js 技术栈，实现趣味 3D 创意页面。本文包含的知识点主要包括：ShadowMaterial、 MeshPhongMaterial 两种基本材质的使用、使用 LoadingManager 展示模型加载进度、OrbitControls 的缓动动画、TWEEN 简单补间动画效果等。

使用threejs来生成全景的方式，网上已经有很多大佬介绍过了，大致分为两种，一种是使用球体+1张全景图，另一种使用立方体+6张环境贴图。

今天使用更简的方式，使用现成的库来实现，Panolens已经帮我们把three中初始化场景、相机、控制器、鼠标事件等操作都封装好了。

2020 Black Friday Cyber Monday (BFCM) is over, and another BFCM Globe has shipped. We’re extremely proud of the globe, it focused on realism, performance, and the impact our merchants have on the world.

Three.js is a JavaScript library for drawing in 3D with WebGL. It enables us to add 3D objects to a scene, and manipulate things like position and lighting. If you’re a developer used to working with the DOM and styling elements with CSS, Three.js and WebGL can seem like a whole new world, and perhaps a little intimidating! This article is for developers who are comfortable with JavaScript but relatively new to Three.js. Our goal is to walk through building something simple but effective with Three.js — a 3D animated figure — to get a handle on the basic principles, and demonstrate that a little knowledge can take you a long way!