webgl

贵州数擎科技有限公司

分形金字塔的 Ray Marching 实现一个由迭代函数系统（IFS）生成的三维分形结构，通过 Ray Marching 渲染出体积光 glow 效果。中心分形球体呈现紫蓝粉渐变的发光碎片结构，周围环绕深紫红色星空背景。相机围绕物体持续旋转，分形本身也在多轴上同时旋转，产生迷幻的动态视觉效果。

PlayCanvas 开源 WebGL/WebGPU 3D 创作平台分析PlayCanvas 是一个开源的 WebGL/WebGPU 3D 游戏引擎与 Web 图形创作平台，提供从开发工具到托管服务的全栈解决方案。

在地图上实现管网拓扑批量移动、旋转与缩放(参考图片的实现方式)用户导入的拓扑数据坐标往往是他们软件内部的坐标，不是标准经纬度。导入到地图上后发现位置完全不对，这时就需要可视化的批量编辑功能，把拓扑"搬"到正确位置。

WebGL 地图上做精准编辑？这套分层方案搞定管网拖拽 / 连接如何在 WebGL 地图上叠加 SVG 编辑层？如何实现地图移动时图形跟随？这篇文章分享我们项目中 L7 + draw2d 的集成方案。

山海鲸可视化

数字孪生项目案例 | 物流园区可视化在数字化转型不断深入的背景下，物流园区的管理方式正从传统经验驱动，迈向数据驱动与可视化管理。基于三维可视化与数字孪生技术，本项目构建了一个集数据展示、进度追踪与智能分析于一体的物流园区可视化平台。通过浅色系风格的城市三维模型与悬浮看板展示，实现园区运行状态与物流数据一屏掌控。

50ms 级实时数字孪生｜汽车先进制造车间工艺流程根据 2026 年工信部等四部门联合印发的《汽车行业数字化转型实施方案》，到 2027 年，数智技术在企业研、产、供、销、服环节深度集成应用，实现关键工序数控化率超 70%，产品研发周期及交付周期缩短 20%，全面提升行业智能制造成熟度与生产效率；到 2030 年，推动汽车产业整体迈入高阶数智化发展阶段。

SuperSplat 深度解析：7.6K Stars 的浏览器端 3D 高斯泼溅编辑器 — 在 Web 上编辑现实项目地址：github.com/playcanvas/… | 7.6K+ Stars | MIT 协议 | 144 Releases (v2.25.1) | 620+ Commits

supermapsupport

SuperMap iClient3D for WebGL 根据实体高度进行差异化颜色渲染三维实体颜色单调？按高度分层染色，一眼看分布！根据实体高度进行差异化颜色渲染实现思路如下图所示：二、示例完整代码

用pixijs实现fabricjs(一)：FakeCanvasRenderingContext2Dfabric的自定义元素，是基于ctx对象完成的(CanvasRenderingContext2D)，我们要使用ctx.fill()，ctx.stroke()等api，来完成图形的绘制，而pixi是webGL渲染，没有canvas2D的这套东西，所以，如果要复刻一个fabric出来，那么我们首先需要用pixi来实现一个ctx，让用户使用起来，像在使用canvas2D一样。既然这个ctx是假的，那就叫它FakeCanvasRenderingContext2D吧！

14、webgl 基本概念 + 图形变换所有顶点移动a_Position 是原始点，属于 attribute 变量 u_Translation 是用来作为改变原始点的为一的变量

李伟_Li慢慢

ShaderToy-山峦+蓝天+白云用noise 绘制山峦的算法：wolfram详解山峦算法1.杂色。2.栅格：降低采样频率，将杂色变成栅格。

爱看书的小沐

【小沐杂货铺】基于Three.js绘制三维艺术画廊3DArtGallery （Three.js，WebGL）3DArtGallery 是基于 WebGL/OpenGL 的沉浸式三维艺术画廊系统，用于在线虚拟艺术展览与数字藏品展示。

爱看书的小沐

【小沐学GIS】基于C++渲染三维飞行仿真Flight Simulation（OpenGL ）第十三期利用 OpenGL 纹理映射、深度测试、光照渲染提升画面真实感，可接入键盘制舵面、油门，完成实时飞行操控、轨迹绘制与飞行状态可视化，适配无人机、固定翼飞行器三维仿真开发。

千鼎数字孪生-可视化

webGPU即将到来，和原生GPU有啥区别呢？WebGPU 和原生 GPU API（如 Vulkan、DirectX 12、Metal）之间的核心区别在于它们的定位、设计目标、运行环境以及开发者控制层级。

认识 WebGL：基本用法与核心 API本章不从复杂的 3D 物体开始，而是完成一个最小可运行的 Demo：在浏览器中创建一个 WebGL 画布，让画布自动适配窗口尺寸，每一帧用 GPU 清空画布，并让背景色缓慢变化。

从工厂模式到简化封装：三维引擎架构演进之路 threejs设计作者：AivoGenX 原创文章，转载请注明出处代码提交记录：https://github.com/AivoGenX/trilab-vue-project/commit/c6a25ea2d97d0a3bc30b7edaaf1bf78fc6db385a

13、webgl基本概念 + 绘制狮子座星空现在上面的这些顶点数据是存储在 js 缓存里的，着色器拿不到，所以需要建立一个着色器和 js 都能进入的公共区

12、webgl 基本概念 +满天星星眨眼睛webgl 画布的建立和获取，和 canvas 2d 是一样的。一旦我们使用 canvas.getContext() 方法获取了 webgl 类型的上下文对象，那这张画布就不再是以前的canvas 2d 画布。当然，它也不会变成三维的，因为我们的电脑屏幕始终是平的。

Vue3 + Trilab：打造高扩展性三维可视化插件化框架实战指南本文深度解析基于Vue3和Trilab引擎的插件化三维可视化框架设计与实现，涵盖架构设计、核心代码、性能优化等完整解决方案。

Vue3 + Three.js 入门实战：从 0 到 1 搭建可交互的 3D 场景（含模型加载与性能优化）Vue3 + Three.js 入门实战：从 0 到 1 搭建可交互的 3D 场景（含模型加载与性能优化）一、为什么是 Vue3 + Three.js 1.1 背景与目标在前端可视化场景里，2D 图表已经很成熟，但在产品演示、数字孪生、3D 展示页、营销互动页中，3D 表达的需求越来越常见。Three.js 是一个对 WebGL 的上层封装库，能让我们用更低门槛的方式在浏览器中渲染 3D 内容；Vue3 则负责组件化组织与状态管理，让工程更易维护。