分享
扫一扫
超级会员免费看
还是大剑师兰特
曾是美国普渡大学计算机研究生，现为GIS领域高级前端开发工程师。深耕openlayers、leaflet、cesium、mapbox、echarts、threejs、webgl、canvas、svg等技术，目前正研究GIS大模型在低空经济领域的应用，拥有两项GIS方面的专利。
展开
-
ThreeJS 综合教程300+【目录】
ThreeJS 综合教程100+旨在为开发者提供两大方面的知识信息：（1）提供详细的每个api知识点的详解 （2）提供实战的示例，提供源代码。 在这量大系统性的知识下，给用户提供清晰的思路和示例参考，更好的服务于自己的threeJS开发项目。原创 2024-09-06 17:54:58 · 1428 阅读 · 0 评论
-
threejs入门（243）：Float32BufferAttribute 详解及使用方法
用于高效管理大型数据集的属性，如位置、颜色或法线。它使用来存储数据，这比常规 JavaScript 数组更节省内存。你可以指定数据是否应归一化，这对于某些类型的属性（如纹理坐标）非常有用。原创 2025-02-17 09:20:33 · 435 阅读 · 36 评论 -
ThreeJS入门（242）：不同的灯光特点，区别以及应用场合
- **环境光**：提供均匀的基础光照，适用于简单场景。- **平行光**：模拟远处的光源，适用于大范围的光照效果。- **点光源**：模拟从一点发出的光，适用于局部光源。- **聚光灯**：模拟有特定方向和角度的光，适用于需要精确控制光照范围的场景。- **半球光**：模拟天空和地面的光照，适用于户外场景。- **矩形面积光**：模拟大面积光源，适用于需要真实软阴影的场景。- **光照探针**：用于高级光照计算，适用于需要全局光照和环境遮挡的场景。原创 2025-02-16 00:00:00 · 625 阅读 · 3 评论 -
threejs入门（241）：渲染加速的10种方法
Three.js 是一个基于 WebGL 的 JavaScript 3D 库，它允许开发者创建丰富的三维图形。为了提高 Three.js 应用程序的性能，特别是渲染速度，可以采取多种方法来利用 GPU 加速。以下是一些常见的优化技术原创 2025-02-15 00:00:00 · 481 阅读 · 3 评论 -
ThreeJS入门（240）：THREE.SpotLightHelper 知识详解，示例代码
`THREE.SpotLightHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个可视化的聚光灯（Spot Light）辅助对象。这个辅助对象可以帮助开发者更好地理解和调试点光源的位置、方向、范围和衰减特性。原创 2025-02-12 00:00:00 · 649 阅读 · 2 评论 -
ThreeJS入门（239）：THREE.SkeletonHelper 知识详解，示例代码
`THREE.SkeletonHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个骨骼辅助对象，帮助开发者更好地理解和调试骨骼动画。这个辅助对象常用于查看和调试复杂角色模型的骨骼结构和动画，特别是在开发涉及角色动画的应用程序时。原创 2025-02-11 00:00:00 · 623 阅读 · 3 评论 -
ThreeJS入门（238）：THREE.PointLightHelper 知识详解，示例代码
`THREE.PointLightHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个可视化的点光源（Point Light）辅助对象。这个辅助对象可以帮助开发者更好地理解和调试点光源的位置、方向和范围。原创 2025-02-10 09:43:37 · 501 阅读 · 9 评论 -
ThreeJS入门（237）：THREE.PlaneHelper 知识详解，示例代码
`THREE.PlaneHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个平面辅助对象，帮助开发者更好地理解和调试平面的位置、方向以及大小。这个辅助对象常用于调试几何体的法线、碰撞检测或者其他需要可视化平面的情况。原创 2025-02-08 09:13:08 · 548 阅读 · 31 评论 -
ThreeJS入门（236）：THREE.HemisphereLightHelper 知识详解，示例代码
`THREE.HemisphereLightHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个可视化的半球光源（Hemisphere Light）辅助对象。这个辅助对象可以帮助开发者更好地理解和调试半球光源的方向及其影响范围。原创 2025-02-07 09:08:32 · 869 阅读 · 13 评论 -
ThreeJS入门（235）：THREE.PolarGridHelper 知识详解，示例代码
`THREE.PolarGridHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个极坐标网格平面。这种网格通常用于模拟圆形或环形的布局，对于那些需要在极坐标系下工作的场景非常有用，例如雷达图、圆形图案设计、天文学中的星图等。原创 2025-02-01 07:54:13 · 1004 阅读 · 0 评论 -
ThreeJS入门（234）：THREE.GridHelper 知识详解，示例代码
`THREE.GridHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个网格平面，帮助开发者更好地理解三维空间中的位置关系和坐标系统。这个工具类常用于调试和对齐物体，尤其是在没有其他参考的情况下，网格可以提供视觉上的帮助。原创 2025-01-29 00:00:00 · 755 阅读 · 7 评论 -
ThreeJS入门（233）：THREE.DirectionalLightHelper 知识详解，示例代码
`THREE.DirectionalLightHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个可视化的方向光源辅助对象。这个辅助对象可以帮助开发者更好地理解和调试方向光源的方向及其影响范围。原创 2025-01-28 00:00:00 · 1162 阅读 · 0 评论 -
ThreeJS入门（232）：THREE.CameraHelper 知识详解，示例代码
`THREE.CameraHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个可视化的摄像机辅助对象。这个辅助对象可以帮助开发者更好地理解和调试摄像机的位置、方向及其视锥体（frustum）的范围。原创 2025-01-27 00:00:00 · 997 阅读 · 1 评论 -
ThreeJS入门（231）：THREE.Box3Helper 知识详解，示例代码
`THREE.Box3Helper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个三维包围盒（Bounding Box）来帮助可视化几何体的空间范围。这个工具类常用于调试目的，帮助开发者更好地理解几何体的大小、位置和方向。原创 2025-01-26 00:00:00 · 921 阅读 · 1 评论 -
ThreeJS入门（230）：THREE.BoxHelper 知识详解，示例代码
`THREE.BoxHelper`是Three.js中的一个辅助工具类，用于在场景中创建一个包围盒（BoundingBox）来帮助可视化几何体的边界范围。这个工具类常用于调试目的，帮助开发者更好地理解几何体的大小、位置和方向。原创 2025-01-25 00:00:00 · 1318 阅读 · 2 评论 -
ThreeJS入门（229）：THREE.AxesHelper 知识详解，示例代码
`THREE.AxesHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个坐标轴来帮助可视化坐标系的方向。这个工具类常用于调试目的，帮助开发者更好地理解场景中的坐标系和物体的方向关系。原创 2025-01-22 00:00:00 · 988 阅读 · 7 评论 -
ThreeJS入门（228）：THREE.ArrowHelper 知识详解，示例代码
`THREE.ArrowHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个箭头来可视化方向向量、法线、轴等。它常用于调试目的，帮助开发者更好地理解几何体的方向和位置。原创 2025-01-21 00:00:00 · 146 阅读 · 5 评论 -
ThreeJS入门（227）：THREE.SVGRenderer 知识详解，示例代码
`THREE.SVGRenderer` 是 Three.js 中的一个特殊类型的渲染器，用于将 Three.js 场景中的几何体渲染为 SVG（可缩放矢量图形）格式。SVG 是一种基于 XML 的矢量图像格式，可以方便地集成到网页中，并且在放大或缩小图像时保持清晰度。原创 2025-01-20 00:00:00 · 695 阅读 · 12 评论 -
ThreeJS入门（226）：THREE.CSS3DRenderer 知识详解，示例代码
`THREE.CSS3DRenderer` 是 Three.js 中的一个特殊类型的渲染器，用于在 Three.js 场景中渲染基于 CSS 的 3D 图形元素。这个渲染器允许你在 3D 场景中添加 HTML 元素，如文本标签、图标和其他 2D 或 3D 图形，并将它们绑定到 3D 几何体上，使得这些元素能够在 3D 场景中正确地定位和显示。原创 2025-01-19 00:00:00 · 799 阅读 · 2 评论 -
ThreeJS入门（225）：THREE.CSS2DRenderer 知识详解，示例代码
`THREE.CSS2DRenderer` 是 Three.js 中的一个特殊类型的渲染器，用于在 Three.js 场景中渲染基于 CSS 的 2D 图形元素。这个渲染器允许你在 3D 场景中添加 HTML 元素，如文本标签、图标和其他 2D 图形，并将它们绑定到 3D 几何体上，使得这些元素能够在 3D 场景中正确地定位和显示。原创 2025-01-18 00:00:00 · 1399 阅读 · 4 评论 -
ThreeJS入门（224）：THREE.EdgeSplitModifier 知识详解，示例代码
`THREE.EdgeSplitModifier` 是 Three.js 中的一个几何体修改器（modifier），用于从已有的几何体中分离出边缘，生成新的几何体。这个修改器通常用于创建边缘增强效果，使几何体的轮廓更加明显。这对于增强三维模型的视觉效果非常有用，尤其是在低多边形模型或风格化渲染中。原创 2025-01-17 07:00:00 · 1337 阅读 · 7 评论 -
ThreeJS入门（223）：THREE.Timer 知识详解，示例代码
`THREE.Timer` 是 Three.js 中的一个实用工具类，用于测量和记录时间间隔。它可以用来监控 Three.js 应用程序中的帧率、渲染时间以及其他与时间相关的统计信息。这对于性能分析和优化非常有用。原创 2025-01-16 00:00:00 · 837 阅读 · 6 评论 -
ThreeJS入门（222）：THREE.STLExporter 知识详解，示例代码
`THREE.STLExporter` 是 Three.js 中的一个导出器，用于将 Three.js 场景中的几何体导出为 STL（STereoLithography）格式。STL 是一种广泛使用的文件格式，主要用于快速原型制作、3D 打印和 CAD（计算机辅助设计）领域。STL 文件主要包含三维模型的三角网格信息，即面片（facet）的顶点位置和法线。原创 2025-01-15 00:00:00 · 947 阅读 · 0 评论 -
ThreeJS入门（221）：THREE.PLYExporter 知识详解，示例代码
`THREE.PLYExporter` 是 Three.js 中的一个导出器，用于将 Three.js 场景中的几何体导出为 PLY（Polygon File Format 或 Point Cloud File Format）格式。PLY 格式是一种用于存储三维数据的文件格式，支持存储顶点位置、颜色、法线等信息。它既可以存储三角网格模型，也可以存储点云数据。原创 2025-01-14 00:00:00 · 656 阅读 · 6 评论 -
ThreeJS入门（220）：THREE.OBJExporter 知识详解，示例代码
`THREE.OBJExporter` 是 Three.js 中的一个导出器，用于将 Three.js 场景中的几何体导出为 OBJ 格式。OBJ 是一种常见的 3D 文件格式，支持顶点位置、法线、纹理坐标等信息。OBJ 文件格式简单且易于处理，因此被广泛应用于 3D 建模软件和游戏引擎中。原创 2025-01-13 00:00:00 · 858 阅读 · 5 评论 -
ThreeJS入门（219）：THREE.GLTFExporter 知识详解，示例代码
`THREE.GLTFExporter` 是 Three.js 中的一个导出器，用于将 Three.js 场景中的内容导出为 GLTF（GL Transmission Format）格式。GLTF 是一种高效的文件格式，用于在不同的应用程序和平台之间交换 3D 场景和模型。它支持各种 3D 内容，包括几何体、纹理、动画和光照等。原创 2025-01-12 00:00:00 · 686 阅读 · 0 评论 -
ThreeJS入门（218）：THREE.EXRExporter 知识详解，示例代码
`THREE.EXRExporter` 是 Three.js 中的一个导出器，用于将渲染结果导出为 HDR（High Dynamic Range）图像格式，通常是 `.exr` 文件。HDR 图像可以保存比标准图像格式（如 JPEG 或 PNG）更多的动态范围信息，这对于光照计算、环境贴图和视觉特效等方面非常有用。原创 2025-01-11 00:00:00 · 1989 阅读 · 0 评论 -
ThreeJS入门（217）：THREE.DRACOExporter 知识详解，示例代码
`THREE.DRACOExporter` 是 Three.js 中的一个导出器，用于将 Three.js 场景中的几何数据压缩成 DRACO 格式。DRACO 是一种高效的几何数据压缩算法，旨在减少三维模型的数据大小，使其更适合在网络上传输。DRACO 可以显著减小模型的体积，同时保持较高的几何细节。原创 2025-01-10 00:00:00 · 879 阅读 · 18 评论 -
ThreeJS入门（216）：THREE.EffectComposer 知识详解，示例代码
`THREE.EffectComposer` 是 Three.js 中的一个合成器类，用于实现后处理效果。后处理是指在渲染完场景之后对最终图像进行处理的技术，可以用来添加诸如模糊、色调调整、辉光、景深等效果。`THREE.EffectComposer` 结合了多个 `THREE.RenderPass` 和 `THREE.ShaderPass` 来组合复杂的后处理流程。原创 2025-01-09 07:30:00 · 1058 阅读 · 3 评论 -
ThreeJS入门（215）：THREE.TGALoader 知识详解，示例代码
`THREE.TGALoader` 是 Three.js 中的一个加载器，用于加载 TGA（Truevision TGA）格式的图像文件。TGA 文件是一种常用的位图图像格式，支持 RGB 和 RGBA 模式，并且可以包含 Alpha 通道。这种格式经常用于游戏开发和其他需要高质量图像的应用中。原创 2025-01-08 07:00:00 · 711 阅读 · 28 评论 -
ThreeJS入门（214）：THREE.SVGLoader 知识详解，示例代码
`THREE.SVGLoader` 是 Three.js 中的一个加载器，用于加载 SVG（Scalable Vector Graphics）格式的矢量图形文件。SVG 文件是一种基于 XML 的文件格式，用于描述二维矢量图形。通过 `THREE.SVGLoader`，你可以将 SVG 图形转换为 Three.js 场景中的三维对象，从而实现与三维场景的交互。原创 2025-01-07 07:00:00 · 1062 阅读 · 3 评论 -
ThreeJS入门（213）：THREE.PDBLoader 知识详解，示例代码
`THREE.PDBLoader` 是 Three.js 中的一个加载器，用于加载 PDB（Protein Data Bank）格式的文件。PDB 文件通常用于存储生物大分子（如蛋白质、核酸等）的原子坐标信息，以及相关的结构数据。这种格式广泛应用于生物化学、分子生物学和药物设计等领域。原创 2025-01-05 07:00:00 · 969 阅读 · 2 评论 -
ThreeJS入门（212）：THREE.PCDLoader 知识详解，示例代码
`THREE.PCDLoader` 是 Three.js 中的一个加载器，用于加载 PCD（Point Cloud Data）格式的点云数据文件。点云是一种表示三维空间中的大量离散点集合的数据结构，常用于激光雷达（LiDAR）、三维扫描仪等设备获取的数据。原创 2025-01-04 07:00:00 · 1114 阅读 · 4 评论 -
ThreeJS入门（211）：THREE.OBJLoader 知识详解，示例代码
`THREE.OBJLoader` 是 Three.js 中的一个加载器，用于加载 OBJ 文件格式的 3D 模型。OBJ 文件格式是 3D 模型交换中最常见的格式之一，它支持基本的几何数据（顶点、面、纹理坐标、法线等）。原创 2025-01-03 00:00:00 · 1133 阅读 · 11 评论 -
ThreeJS入门（210）：THREE.MTLLoader 知识详解，示例代码
`THREE.MTLLoader` 是 Three.js 中的一个加载器，用于加载材质描述文件（`.mtl` 文件）。这种文件通常与 `.obj` 文件一起使用，用于定义模型的材质属性，如颜色、纹理、透明度等。`.mtl` 文件包含了各种材质的定义，以及它们对应的纹理文件路径。原创 2025-01-02 00:00:00 · 839 阅读 · 34 评论 -
ThreeJS入门（209）：THREE.MMDLoader 知识详解，示例代码
`THREE.MMDLoader` 是 Three.js 中的一个加载器，用于加载 MikuMikuDance（简称 MMD）格式的模型和动画文件。MMD 是一款流行的免费 3D 动画制作软件，主要用于创建虚拟偶像的舞蹈和表演动画。MMD 文件通常包含模型几何体、纹理、材质和动画数据。原创 2025-01-01 00:00:00 · 976 阅读 · 0 评论 -
ThreeJS入门（208）：THREE.LUTCubeLoader 知识详解，示例代码
`THREE.LUTCubeLoader` 是 Three.js 中的一个加载器，用于加载 3D LUT（Look-Up Table）立方体文件。3D LUT 文件通常用于色彩校正和色彩管理，通过定义一个三维色彩变换表来修改图像的颜色。这种技术常用于后期制作和视频编辑中，以实现复杂的色彩调整。原创 2024-12-31 00:00:00 · 1639 阅读 · 0 评论 -
ThreeJS入门（207）：THREE.LUT3dlLoader 知识详解，示例代码
`THREE.LUT3dlLoader` 是 Three.js 中的一个加载器，用于加载 3D LUT（Look-Up Table）文件。3D LUT 通常用于色彩校正和色彩管理，可以在渲染过程中应用复杂的色彩变换。3D LUT 文件通常是一个 3D 立方体表格，每个点代表一个输入颜色值，并映射到一个输出颜色值上。原创 2024-12-30 07:00:00 · 978 阅读 · 9 评论 -
ThreeJS入门（206）：THREE.LDrawLoader 知识详解，示例代码
`THREE.LDrawLoader` 是 Three.js 中的一个加载器，用于加载 LEGO 数字化设计（LDraw）格式的文件。LDraw 是一个开放标准，用于描述 LEGO 模型的数字化文件格式。这种格式被广泛应用于 LEGO 模型的设计和共享。原创 2024-12-29 06:00:00 · 1096 阅读 · 4 评论 -
ThreeJS入门（205）：THREE.KTX2Loader 知识详解，示例代码
`THREE.KTX2Loader` 是 Three.js 中的一个加载器，用于加载 KTX 2.0 格式的纹理文件。KTX 2.0（Khronos Texture Format 2.0）是一种高效的纹理压缩格式，支持多种图像压缩算法，如 BC、ASTC、ETC2、PVRTC 等。这种格式不仅减少了纹理文件的大小，还提高了加载速度，非常适合在 Web 上使用。原创 2024-12-28 00:00:00 · 879 阅读 · 0 评论