WebGL/WebGPU
关注
分享
扫一扫
WebGL与WebGPU相关技术和应用
含影
高交互性3D内容生产/协作，
跨平台3D引擎，
跨平台渲染引擎，
高性能计算
展开
-
轻量封装WebGPU渲染系统示例＜55＞- 顶点数据更新
轻量封装WebGPU渲染系统示例＜55＞- 顶点数据更新原创 2023-12-31 20:44:48 · 662 阅读 · 2 评论 -
像素抖动(Pixel Dithering) 的Shader实现
莫列波纹(Moiré pattern)与Banding有时候会会对图像画面造成显示问题。在实时渲染中，用Shader实现的Dithering能缓解这类问题。这里给出HLSL, GLSL, WGSL这些环境的Dithering Shader实现。原创 2023-12-28 06:57:28 · 821 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜54＞- 表现GLB模型之拱形门
轻量封装WebGPU渲染系统示例＜54＞- 表现GLB模型之拱形门原创 2023-12-22 07:56:41 · 530 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜53＞- 多盏灯灯光照在地面的效果
轻量封装WebGPU渲染系统示例＜53＞- 盏灯灯光照在地面的效果WebGPU实时渲染实现模拟多盏灯的灯光照在地面的效果灯光效果 。原创 2023-12-18 23:41:52 · 538 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜52＞- Json数据描述材质、纹理等3D渲染场景信息
轻量封装WebGPU渲染系统示例＜52＞- Json数据描述材质、纹理等3D渲染场景信息原创 2023-12-17 22:18:24 · 648 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜51＞- 视差贴图(Parallax Map)(源码)
轻量封装WebGPU渲染系统示例＜51＞- 视差贴图(Parallax Map)(源码)。视差纹理是一种片段着色阶段增强材质表面凹凸细节的技术。这里在WebGPU的实时渲染材质管线中实现了视差贴图计算，以便增强相关的纹理细节表现力。原创 2023-12-17 11:18:54 · 532 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜50＞- Json数据描述材质等3D渲染场景信息
轻量封装WebGPU渲染系统示例＜50＞- Json数据描述材质等3D渲染场景信息本示例中的3d渲染场景由Json数据来描述。包含3个主要部分:1. Json描述渲染器的基本信息。2. Json描述渲染场景的环境信息,包括全局的灯光、阴影、雾等。3. Json描述构成场景的各个可选人实体，包括几何信息、transform、材质、渲染状态等。原创 2023-12-16 22:22:17 · 641 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜49＞- 多种灯光多材质(源码)
轻量封装WebGPU渲染系统示例＜49＞- 多种灯光多材质(源码)原创 2023-12-16 13:00:09 · 179 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜48＞- 多种光源的多种组合(源码)
轻量封装WebGPU渲染系统示例＜48＞- 多种光源的多种组合(源码)原创 2023-12-13 08:00:01 · 483 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜47＞- 多种光源(源码)
轻量封装WebGPU渲染系统示例＜47＞- 多种光源(源码)原创 2023-12-12 07:40:09 · 145 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜46＞- 材质组装管线(MaterialPipeline)灯光、阴影、雾以及多Pass(源码)
轻量封装WebGPU渲染系统示例＜46＞- 材质组装管线(MaterialPipeline)灯光、阴影、雾以及多Pass(源码)原创 2023-12-10 14:26:47 · 308 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜45＞- 材质组装流水线(MaterialPipeline)灯光、阴影、雾(源码)
轻量封装WebGPU渲染系统示例＜45＞- 材质组装流水线(MaterialPipeline)灯光、阴影、雾(源码)原创 2023-12-10 12:10:01 · 556 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜44＞- 材质组装流水线(MaterialPipeline)之灯光和柔和阴影(源码)
轻量封装WebGPU渲染系统示例＜44＞- 材质组装流水线(MaterialPipeline)之灯光和柔和阴影(源码)原创 2023-12-09 12:47:13 · 557 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜43＞- PBR材质与阴影实(源码)
轻量封装WebGPU渲染系统示例＜43＞- PBR材质与阴影实(源码)。原理简介: 1. 基于rendering pass graph实现。 2. WGSL Shader 基于文件系统和宏机制动态组装。原创 2023-12-05 07:53:19 · 557 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜42＞- vsm阴影实现过程(源码)
轻量封装WebGPU渲染系统示例＜42＞- vsm阴影实现过程(源码)。这里的源码包括了VSM实现每个阶段的Shader WGSL源码。原创 2023-12-03 12:07:23 · 604 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜41＞- 前向渲染的雾(Fog)效果(源码)
轻量封装WebGPU渲染系统示例＜41＞- 前向渲染的雾(Fog)效果(源码)原创 2023-12-02 12:17:40 · 203 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜40＞- 多层材质的Mask混合(源码)
轻量封装WebGPU渲染系统示例＜40＞- 多重材质的Mask混合(源码)原创 2023-12-02 08:36:16 · 311 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜39＞- emissive和arm纹理支持(源码)
轻量封装WebGPU渲染系统示例＜39＞- emissive和arm纹理支持(源码)原创 2023-11-29 22:57:11 · 329 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜38＞- 动态构建WGSL材质Shader(源码)
轻量封装WebGPU渲染系统示例＜38＞- 动态构建WGSL材质Shader(源码)基于Macro宏定义和WGSL Shader文件系统实现原创 2023-11-23 06:50:49 · 665 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜37＞- 多个局部点光源应用于非金属材质形成的效果(源码)
轻量封装WebGPU渲染系统示例＜37＞- 多个局部点光源应用于非金属材质形成的效果(源码)原创 2023-11-21 19:39:29 · 502 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜36＞- 广告板(Billboard)(WGSL源码)
轻量封装WebGPU渲染系统示例＜36＞- 广告板(Billboard)(WGSL源码)原创 2023-11-21 13:11:31 · 376 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜35＞- HDR环境数据应用到PBR渲染材质
轻量封装WebGPU渲染系统示例＜35＞- HDR环境数据应用到PBR渲染材质原创 2023-11-20 21:15:47 · 494 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜34＞- 数据驱动之Json构建场景
轻量封装WebGPU渲染系统示例＜34＞- 数据驱动之Json构建场景原创 2023-11-17 13:18:29 · 231 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜7＞ - 完整的元胞自动机之生命游戏的完整实现(源码)
Google codelab WebGPU入门教程源码＜7＞ - 完整的元胞自动机之生命游戏的完整实现(源码)原创 2023-11-16 12:24:41 · 182 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜6＞ - 使用计算着色器实现计算元胞自动机之生命游戏模拟过程(源码)
Google codelab WebGPU入门教程源码＜6＞ - 使用计算着色器实现计算元胞自动机之生命游戏模拟过程(源码)原创 2023-11-16 12:19:11 · 286 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜5＞ - 使用Storage类型对象给着色器传数据(源码)
Google codelab WebGPU入门教程源码＜5＞ - 使用Storage类型对象给着色器传数据(源码)原创 2023-11-16 12:14:00 · 269 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜4＞ - 使用Uniform类型对象给着色器传数据(源码)
Google codelab WebGPU入门教程源码＜4＞ - 使用Uniform类型对象给着色器传数据(源码)原创 2023-11-16 12:06:54 · 304 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜3＞ - 绘制网格(源码)
Google codelab WebGPU入门教程源码＜3＞ - 绘制网格(源码)原创 2023-11-16 12:00:31 · 202 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜2＞ - 绘制几何形状(源码)
Google codelab WebGPU入门教程源码＜2＞ - 绘制几何形状(源码)原创 2023-11-16 11:54:39 · 126 阅读 · 0 评论 -
Google codelab WebGPU入门教程源码＜1＞ - 初始化WebGPU(源码)
Google codelab WebGPU入门教程源码 - 初始化WebGPU(源码)原创 2023-11-16 11:48:55 · 176 阅读 · 0 评论 -
用WebGPU入门教程: 从最简单的代码开始绘制一个彩色三角形源码
用WebGPU入门教程: 从最简单的代码开始绘制一个彩色三角形源码原创 2023-11-16 11:37:17 · 168 阅读 · 0 评论 -
WebGPU学习路径与资源分享
WebGPU入门学习路径与资源分享原创 2023-11-16 11:24:03 · 246 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜33＞- 单精度浮点纹理(源码)
轻量封装WebGPU渲染系统示例＜33＞- 单精度浮点纹理也就是rgba16float格式纹理的实现(源码)原创 2023-11-16 08:59:28 · 161 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜32＞- 若干线框对象(源码)
轻量封装WebGPU渲染系统示例＜32＞- 若干线框对象(源码)原创 2023-11-15 20:47:04 · 528 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜31＞- 若干线条对象(源码)
轻量封装WebGPU渲染系统示例＜31＞- 若干线条对象(源码)AABB包围盒，OBB包围盒, 曲线，直线，圆，坐标轴，视锥体线框，方形网格等原创 2023-11-14 19:44:24 · 145 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜30＞- 绘制线段(源码)
轻量封装WebGPU渲染系统示例＜30＞- 绘制线段(源码)原创 2023-11-14 13:40:57 · 294 阅读 · 2 评论 -
轻量封装WebGPU渲染系统示例＜29＞- 深度模糊DepthBlur(源码)
轻量封装WebGPU渲染系统示例＜29＞- 深度模糊DepthBlur(源码)原创 2023-11-13 22:51:46 · 350 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜28＞- MRT纹理(源码)
轻量封装WebGPU渲染系统示例＜28＞- MRT纹理原创 2023-11-13 22:44:02 · 288 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜27＞- 浮点RTT纹理(源码)
轻量封装WebGPU渲染系统示例＜27＞- 浮点RTT纹理应用(源码)原创 2023-11-13 20:44:15 · 298 阅读 · 0 评论 -
轻量封装WebGPU渲染系统示例＜26＞- PingpongBlur模糊效果(源码)
轻量封装WebGPU渲染系统示例＜26＞- PingpongBlur模糊效果(源码)原创 2023-11-13 08:51:04 · 138 阅读 · 0 评论