1.概况 之前粗略入门了一下计算机图形学和webgl，还有很多很多概念都没有涉及到，不过不影响学习新的工具threejs。它是一个帮助你绘制图像的工具库，封装了底层的webgl操作。学习的时候还是要谨...

哈喽大家好啊，我是广州小井。上一节我们初步了解了相机和视图矩阵，并且通过 three.js 的 lookAt 方法实战感受了通过相机观测图形的效果，get 到了变换相机位置观测图形和变换图形自身是一个反...

一个简易的烟花。 一个烟花的生命周期，从初升到徇烂到凋零，这就是全过程。 亮点 首先需要来一个光点。 光点就是中心最亮， 距离越远，亮度衰减的越快，超出一定距离后，视觉上就无光了。 所以...

哈喽大家好啊，我是广州小井。上一节我们初步了解了相机和视图矩阵，并且通过 three.js 的 lookAt 方法实战感受了通过相机观测图形的效果，get 到了变换相机位置观测图形和变换图形自身是一个反...

问题引出 最近在做基于WebGL的路径追踪时，遇到了一个法线（凹凸）贴图的问题，如下图，凹凸效果走样特别严重。通过问题分析，目前渲染器还缺少对不同纹理过滤类型的实现，今天刚好完成了相关内...

全景看图是一个比较有趣的功能，全景看图让我们有一种身临场景的感觉，给用户一种更直观的体验。实现全景看图通过CSS3D即可实现，但是这里我分享关于Three.js的全景看图，因为Three.js可以实现...

回顾曲线的绘制 前面使用造型函数绘制曲线的一般方法是， 计算出当前x坐标对应的曲线的y坐标y1，和当前片元凡人y坐标y0相减， 取其绝对值。 显然，当差值为0 的时候，说明这个点，精准的落在曲...

【shader】模糊与区域清晰效果 背景—— 群里大佬发个有意思的视频 刚好有思路写了demo实现一下 shader基础入门的话可以看看这两位大佬的文章 Three.js 进阶之旅：Shader着色器基础图案-旷野之...

汽车的3D展示是一个比较常见的应用，今天我就通过three.js来与大家分享如何实现一个非常简单的3D汽车展示场景。 前言 虽然例子很简单，但也需要您掌握基本的three.js知识点，例如场景、模型等基...

哈喽大家好啊，我是广州小井。从上两个小节我们已经掌握了立方体的绘制方式，并且我们可以通过一定的手段（旋转）来观察出我们绘制的是一个立方体而不是普通的矩形。那么在这其中，涉及到了一些...

之前有实现过基于three.js的八叉树碰撞检测，当我们继续拓展时，利用three.js的便捷开发，尝试实现一个火影忍者的世界，当然只是一个小世界，一个简单的人物，一个简单的场景，一些简单的交互，...

前言 做3D场景相关项目的都知道，3D场景中常见的痛点，便是模型过大，面数过多，纹理太高清，节点层级过多等等，导致场景加载慢，渲染性能低，场景帧率低，如果模型开发的配合，可以让他们把模...

我用WebGL打造了一款动态壁纸 简述 最近在给自己电脑换壁纸的时候发现了一张很有特点的图（就是下面这张），于是我突发奇想，要是能把这张图变成一张动态的壁纸。那该多好。于是我打算用threejs...

前言 大部分人会有一种感觉threejs学习更多的在学api，原理也只是略懂，为了深入学习，接下来我们将深入Threejs的core目录下的BufferAttribute类看看它做了什么？ core 在threejs的core核心文件...

文章更新（可能 ❌ / 一定 ✅）没那么频繁，欢迎加入「可视化交流群」进行交流。加古柳微信「xiaoaizhj」备注「可视化加群」即可，也有机会围观古柳朋友圈，实时追踪最新动态！另外，大家可以点...

材质（Material）是用来定义物体外观的重要组成部分。它们决定了物体如何反射光线并显示在屏幕上。Three.js 提供了多种不同类型的材质，每种材质都有不同的特性和效果。材质就像物体的皮肤，它...

打造原生 WebGL 2D 引擎：一场创意与技术的融合 1.引言 在当今数字化时代，网页的功能越来越丰富，已经远远超越了传统的文本和图片呈现。我们生活在一个充满交互性和视觉魅力的网络世界。每天都...

本文将直接从threejs的源码的基础几何体正方体和球体入手，深度解析原理。如果有webgl的基础的话，那么几何体的制作是非常容易的。 正方体 我们先看正方体的源码实现 import { BufferGeometry }...

哈喽大家好啊，我是广州小井。上一小节中，我们实战了一个渐变色立方体的绘制，学习了新的绘制api，但是在文章的结尾，我留下了个疑问，就是如何绘制一个6面为不同纯色的立方体呢？那我们这一节...

如何实现点选 我们如何控制鼠标在点击后将目标图元做高亮或其他处理呢？ 嗯....，在web端如果是svg或者是dom，我们可以简单绑定click事件修改样式, 那本文差不多也结束了。 ? 额，别急着划开，...