Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

WebGPURenderer: Add cube face to readRenderTargetPixelsAsync parameters #1244

Merged
merged 6 commits into from
Sep 22, 2024
Merged

WebGPURenderer: Add cube face to readRenderTargetPixelsAsync parameters #1244

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
0741183
Update three.js
Methuselah96 Sep 22, 2024
1bc36bb
Add src
Methuselah96 Sep 22, 2024
18545f4
Update patch and delete src
Methuselah96 Sep 22, 2024
acda885
Update declarations
Methuselah96 Sep 22, 2024
79d44fb
Add examples
Methuselah96 Sep 22, 2024
b6a0a3c
Update patch and delete examples
Methuselah96 Sep 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 11 additions & 10 deletions examples-testing/changes.patch
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5912,12 +5912,12 @@ index 230cebfa..56651e28 100644
light.color.setHSL(h, s, l);
light.position.set(x, y, z);
diff --git a/examples-testing/examples/webgl_lightprobe.ts b/examples-testing/examples/webgl_lightprobe.ts
index 2efcad52..b21d0287 100644
index 58f021e6..1427cce4 100644
--- a/examples-testing/examples/webgl_lightprobe.ts
+++ b/examples-testing/examples/webgl_lightprobe.ts
@@ -5,12 +5,15 @@ import { GUI } from 'three/addons/libs/lil-gui.module.min.js';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { LightProbeGenerator } from 'three/addons/lights/LightProbeGenerator.js';
@@ -8,12 +8,15 @@ import { LightProbeGenerator } from 'three/addons/lights/LightProbeGenerator.js'

import { LightProbeHelper } from 'three/addons/helpers/LightProbeHelper.js';

-let mesh, renderer, scene, camera;
+let mesh: THREE.Mesh<THREE.SphereGeometry, THREE.MeshStandardMaterial>,
Expand All @@ -5934,7 +5934,7 @@ index 2efcad52..b21d0287 100644

// linear color space
const API = {
@@ -55,7 +58,7 @@ function init() {
@@ -58,7 +61,7 @@ function init() {
scene.add(directionalLight);

// envmap
Expand Down Expand Up @@ -13566,17 +13566,18 @@ index cfd72172..ae3271f9 100644

renderer.render(scene, camera);
diff --git a/examples-testing/examples/webgpu_lightprobe.ts b/examples-testing/examples/webgpu_lightprobe.ts
index a34ad2de..5a90c688 100644
index 66f9ffcb..0bcfb599 100644
--- a/examples-testing/examples/webgpu_lightprobe.ts
+++ b/examples-testing/examples/webgpu_lightprobe.ts
@@ -1,16 +1,19 @@
@@ -1,4 +1,4 @@
-import * as THREE from 'three';
+import * as THREE from 'three/webgpu';

import { GUI } from 'three/addons/libs/lil-gui.module.min.js';

import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { LightProbeGenerator } from 'three/addons/lights/LightProbeGenerator.js';
@@ -8,12 +8,15 @@ import { LightProbeGenerator } from 'three/addons/lights/LightProbeGenerator.js'

import { LightProbeHelper } from 'three/addons/helpers/LightProbeHelperGPU.js';

-let mesh, renderer, scene, camera;
+let mesh: THREE.Mesh<THREE.SphereGeometry, THREE.MeshStandardMaterial>,
Expand All @@ -13594,7 +13595,7 @@ index a34ad2de..5a90c688 100644

// linear color space
const API = {
@@ -55,7 +58,7 @@ function init() {
@@ -58,7 +61,7 @@ function init() {
scene.add(directionalLight);

// envmap
Expand Down
72 changes: 36 additions & 36 deletions src-testing/changes.patch
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4872,7 +4872,7 @@ index 0ec34b04..573cae2b 100644

this.vertexProgram = vertexProgram;
diff --git a/src-testing/src/renderers/common/Renderer.ts b/src-testing/src/renderers/common/Renderer.ts
index 1d948688..6561a466 100644
index 19a2edd3..b1f209bf 100644
--- a/src-testing/src/renderers/common/Renderer.ts
+++ b/src-testing/src/renderers/common/Renderer.ts
@@ -35,7 +35,36 @@ import {
Expand Down Expand Up @@ -5593,17 +5593,16 @@ index 1d948688..6561a466 100644
if (this._initialized === false) {
console.warn(
'THREE.Renderer: .hasFeature() called before the backend is initialized. Try using .hasFeatureAsync() instead.',
@@ -1077,64 +1270,77 @@ class Renderer {
@@ -1077,7 +1270,7 @@ class Renderer {
return this.backend.hasFeature(name);
}

- copyFramebufferToTexture(framebufferTexture) {
+ copyFramebufferToTexture(framebufferTexture: FramebufferTexture) {
const renderContext = this._currentRenderContext;

- this._textures.updateTexture(framebufferTexture);
+ this._textures!.updateTexture(framebufferTexture);

this._textures.updateTexture(framebufferTexture);
@@ -1085,56 +1278,70 @@ class Renderer {
this.backend.copyFramebufferToTexture(framebufferTexture, renderContext);
}

Expand All @@ -5623,16 +5622,17 @@ index 1d948688..6561a466 100644
this.backend.copyTextureToTexture(srcTexture, dstTexture, srcRegion, dstPosition, level);
}

- readRenderTargetPixelsAsync(renderTarget, x, y, width, height, index = 0) {
- readRenderTargetPixelsAsync(renderTarget, x, y, width, height, index = 0, faceIndex = 0) {
+ readRenderTargetPixelsAsync(
+ renderTarget: RenderTarget,
+ x: number,
+ y: number,
+ width: number,
+ height: number,
+ index = 0,
+ faceIndex = 0,
+ ) {
return this.backend.copyTextureToBuffer(renderTarget.textures[index], x, y, width, height);
return this.backend.copyTextureToBuffer(renderTarget.textures[index], x, y, width, height, faceIndex);
}

- _projectObject(object, camera, groupOrder, renderList) {
Expand Down Expand Up @@ -5692,7 +5692,7 @@ index 1d948688..6561a466 100644
.applyMatrix4(object.matrixWorld)
.applyMatrix4(_projScreenMatrix);
}
@@ -1144,7 +1350,7 @@ class Renderer {
@@ -1144,7 +1351,7 @@ class Renderer {

for (let i = 0, l = groups.length; i < l; i++) {
const group = groups[i];
Expand All @@ -5701,7 +5701,7 @@ index 1d948688..6561a466 100644

if (groupMaterial && groupMaterial.visible) {
renderList.push(object, geometry, groupMaterial, groupOrder, _vector4.z, group);
@@ -1161,7 +1367,7 @@ class Renderer {
@@ -1161,7 +1368,7 @@ class Renderer {
const baseRenderList = renderList;

// replace render list
Expand All @@ -5710,7 +5710,7 @@ index 1d948688..6561a466 100644

renderList.begin();

@@ -1181,13 +1387,13 @@ class Renderer {
@@ -1181,13 +1388,13 @@ class Renderer {
}
}

Expand All @@ -5726,7 +5726,7 @@ index 1d948688..6561a466 100644
// process renderable objects

for (let i = 0, il = renderList.length; i < il; i++) {
@@ -1198,42 +1404,50 @@ class Renderer {
@@ -1198,42 +1405,50 @@ class Renderer {

const { object, geometry, material, group } = renderItem;

Expand Down Expand Up @@ -5788,7 +5788,7 @@ index 1d948688..6561a466 100644
let overridePositionNode;
let overrideFragmentNode;
let overrideDepthNode;
@@ -1318,14 +1532,22 @@ class Renderer {
@@ -1318,14 +1533,22 @@ class Renderer {
object.onAfterRender(this, scene, camera, geometry, material, group);
}

Expand All @@ -5814,7 +5814,7 @@ index 1d948688..6561a466 100644
passId,
);
renderObject.drawRange = object.geometry.drawRange;
@@ -1333,12 +1555,12 @@ class Renderer {
@@ -1333,12 +1556,12 @@ class Renderer {

//

Expand All @@ -5832,7 +5832,7 @@ index 1d948688..6561a466 100644

//

@@ -1350,31 +1572,38 @@ class Renderer {
@@ -1350,31 +1573,38 @@ class Renderer {

this.backend.draw(renderObject, this.info);

Expand Down Expand Up @@ -7092,7 +7092,7 @@ index 9405a1d4..fd9aed09 100644
const nodeBuilder = renderObject.getNodeBuilderState();

diff --git a/src-testing/src/renderers/webgl-fallback/WebGLBackend.ts b/src-testing/src/renderers/webgl-fallback/WebGLBackend.ts
index 361b2da4..a3777b22 100644
index a03c88ad..baf0ae06 100644
--- a/src-testing/src/renderers/webgl-fallback/WebGLBackend.ts
+++ b/src-testing/src/renderers/webgl-fallback/WebGLBackend.ts
@@ -13,6 +13,7 @@ import { WebGLBufferRenderer } from './WebGLBufferRenderer.js';
Expand All @@ -7107,9 +7107,9 @@ index 361b2da4..a3777b22 100644
this.textureUtils.destroyTexture(texture);
}

- copyTextureToBuffer(texture, x, y, width, height) {
+ copyTextureToBuffer(texture: Texture, x: number, y: number, width: number, height: number) {
return this.textureUtils.copyTextureToBuffer(texture, x, y, width, height);
- copyTextureToBuffer(texture, x, y, width, height, faceIndex) {
+ copyTextureToBuffer(texture: Texture, x: number, y: number, width: number, height: number, faceIndex: number) {
return this.textureUtils.copyTextureToBuffer(texture, x, y, width, height, faceIndex);
}

diff --git a/src-testing/src/renderers/webgl-fallback/nodes/GLSLNodeBuilder.ts b/src-testing/src/renderers/webgl-fallback/nodes/GLSLNodeBuilder.ts
Expand Down Expand Up @@ -7509,20 +7509,20 @@ index 480df056..7509b1d7 100644
const nodeData = this.getDataFromNode(node, shaderStage, this.globalCache);

diff --git a/src-testing/src/renderers/webgpu/WebGPUBackend.ts b/src-testing/src/renderers/webgpu/WebGPUBackend.ts
index 35b85d00..caadb1c5 100644
index 2b0e1ea0..42869c3e 100644
--- a/src-testing/src/renderers/webgpu/WebGPUBackend.ts
+++ b/src-testing/src/renderers/webgpu/WebGPUBackend.ts
@@ -978,7 +978,7 @@ class WebGPUBackend extends Backend {
this.textureUtils.destroyTexture(texture);
}

- copyTextureToBuffer(texture, x, y, width, height) {
+ copyTextureToBuffer(texture: Texture, x: number, y: number, width: number, height: number) {
return this.textureUtils.copyTextureToBuffer(texture, x, y, width, height);
- copyTextureToBuffer(texture, x, y, width, height, faceIndex) {
+ copyTextureToBuffer(texture: Texture, x: number, y: number, width: number, height: number, faceIndex: number) {
return this.textureUtils.copyTextureToBuffer(texture, x, y, width, height, faceIndex);
}

diff --git a/src-testing/src/renderers/webgpu/nodes/WGSLNodeBuilder.ts b/src-testing/src/renderers/webgpu/nodes/WGSLNodeBuilder.ts
index 83cb6f99..70020012 100644
index 45eed64a..47907e90 100644
--- a/src-testing/src/renderers/webgpu/nodes/WGSLNodeBuilder.ts
+++ b/src-testing/src/renderers/webgpu/nodes/WGSLNodeBuilder.ts
@@ -10,7 +10,7 @@ import {
Expand All @@ -7543,7 +7543,7 @@ index 83cb6f99..70020012 100644

// GPUShaderStage is not defined in browsers not supporting WebGPU
const GPUShaderStage = self.GPUShaderStage;
@@ -183,7 +185,13 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -191,7 +193,13 @@ class WGSLNodeBuilder extends NodeBuilder {
return texture.isVideoTexture === true && texture.colorSpace !== NoColorSpace;
}

Expand All @@ -7558,7 +7558,7 @@ index 83cb6f99..70020012 100644
if (shaderStage === 'fragment') {
if (depthSnippet) {
return `textureSample( ${textureProperty}, ${textureProperty}_sampler, ${uvSnippet}, ${depthSnippet} )`;
@@ -228,7 +236,12 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -236,7 +244,12 @@ class WGSLNodeBuilder extends NodeBuilder {
return `tsl_biquadraticTexture( ${textureProperty}, ${uvSnippet}, i32( ${levelSnippet} ) )`;
}

Expand All @@ -7572,7 +7572,7 @@ index 83cb6f99..70020012 100644
this._include('repeatWrapping');

const dimension =
@@ -239,7 +252,13 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -247,7 +260,13 @@ class WGSLNodeBuilder extends NodeBuilder {
return `textureLoad( ${textureProperty}, tsl_repeatWrapping( ${uvSnippet}, ${dimension} ), i32( ${levelSnippet} ) )`;
}

Expand All @@ -7587,7 +7587,7 @@ index 83cb6f99..70020012 100644
if (depthSnippet) {
return `textureLoad( ${textureProperty}, ${uvIndexSnippet}, ${depthSnippet}, ${levelSnippet} )`;
} else {
@@ -274,11 +293,11 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -282,11 +301,11 @@ class WGSLNodeBuilder extends NodeBuilder {
}

generateTextureGrad(
Expand All @@ -7604,7 +7604,7 @@ index 83cb6f99..70020012 100644
shaderStage = this.shaderStage,
) {
if (shaderStage === 'fragment') {
@@ -290,11 +309,11 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -298,11 +317,11 @@ class WGSLNodeBuilder extends NodeBuilder {
}

generateTextureCompare(
Expand All @@ -7621,7 +7621,7 @@ index 83cb6f99..70020012 100644
shaderStage = this.shaderStage,
) {
if (shaderStage === 'fragment') {
@@ -307,11 +326,11 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -315,11 +334,11 @@ class WGSLNodeBuilder extends NodeBuilder {
}

generateTextureLevel(
Expand All @@ -7638,7 +7638,7 @@ index 83cb6f99..70020012 100644
shaderStage = this.shaderStage,
) {
let snippet = null;
@@ -333,11 +352,11 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -341,11 +360,11 @@ class WGSLNodeBuilder extends NodeBuilder {
}

generateTextureBias(
Expand All @@ -7655,7 +7655,7 @@ index 83cb6f99..70020012 100644
shaderStage = this.shaderStage,
) {
if (shaderStage === 'fragment') {
@@ -347,7 +366,7 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -355,7 +374,7 @@ class WGSLNodeBuilder extends NodeBuilder {
}
}

Expand All @@ -7664,7 +7664,7 @@ index 83cb6f99..70020012 100644
if (node.isNodeVarying === true && node.needsInterpolation === true) {
if (shaderStage === 'vertex') {
return `varyings.${node.name}`;
@@ -414,7 +433,12 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -422,7 +441,12 @@ class WGSLNodeBuilder extends NodeBuilder {
}
}

Expand All @@ -7678,7 +7678,7 @@ index 83cb6f99..70020012 100644
const uniformNode = super.getUniformFromNode(node, type, shaderStage, name);
const nodeData = this.getDataFromNode(node, shaderStage, this.globalCache);

@@ -526,7 +550,7 @@ class WGSLNodeBuilder extends NodeBuilder {
@@ -534,7 +558,7 @@ class WGSLNodeBuilder extends NodeBuilder {
return 'vertexIndex';
}

Expand All @@ -7687,7 +7687,7 @@ index 83cb6f99..70020012 100644
const layout = shaderNode.layout;
const flowData = this.flowShaderNode(shaderNode);

@@ -649,8 +673,8 @@ ${flowData.code}
@@ -657,8 +681,8 @@ ${flowData.code}
return snippets.join(',\n\t');
}

Expand All @@ -7698,7 +7698,7 @@ index 83cb6f99..70020012 100644

if (shaderStage === 'compute') {
this.getBuiltin('global_invocation_id', 'id', 'vec3<u32>', 'attribute');
@@ -731,8 +755,8 @@ ${flowData.code}
@@ -739,8 +763,8 @@ ${flowData.code}
return `\n${snippets.join('\n')}\n`;
}

Expand All @@ -7709,7 +7709,7 @@ index 83cb6f99..70020012 100644

if (shaderStage === 'vertex') {
this.getBuiltin('position', 'Vertex', 'vec4<f32>', 'vertex');
@@ -768,7 +792,7 @@ ${flowData.code}
@@ -776,7 +800,7 @@ ${flowData.code}
return shaderStage === 'vertex' ? this._getWGSLStruct('VaryingsStruct', '\t' + code) : code;
}

Expand Down
2 changes: 1 addition & 1 deletion three.js
Open in desktop
Submodule three.js updated 21 files
+32 −40 build/three.cjs
+32 −40 build/three.module.js
+1 −1 build/three.module.min.js
+47 −18 build/three.webgpu.js
+1 −1 build/three.webgpu.min.js
+47 −18 build/three.webgpu.nodes.js
+1 −1 build/three.webgpu.nodes.min.js
+1 −1 docs/manual/en/introduction/How-to-update-things.html
+1 −1 examples/jsm/exporters/EXRExporter.js
+1 −1 examples/jsm/exporters/KTX2Exporter.js
+3 −8 examples/jsm/utils/ShadowMapViewer.js
+ − examples/screenshots/webgl_lightprobe.jpg
+ − examples/screenshots/webgpu_lightprobe.jpg
+9 −0 examples/webgl_lightprobe.html
+9 −0 examples/webgpu_lightprobe.html
+32 −40 src/renderers/WebGLRenderer.js
+2 −2 src/renderers/common/Renderer.js
+2 −2 src/renderers/webgl-fallback/WebGLBackend.js
+5 −2 src/renderers/webgl-fallback/utils/WebGLTextureUtils.js
+2 −2 src/renderers/webgpu/WebGPUBackend.js
+2 −2 src/renderers/webgpu/utils/WebGPUTextureUtils.js
1 change: 1 addition & 0 deletions types/three/src/renderers/common/Renderer.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -253,6 +253,7 @@ declare class Renderer {
width: number,
height: number,
index?: number,
faceIndex?: number,
): Promise<import("../../core/BufferAttribute.js").TypedArray>;
_projectObject(object: Object3D, camera: Camera, groupOrder: number, renderList: RenderList): void;
_renderBundles(bundles: Bundle[], sceneRef: Scene, lightsNode: LightsNode): void;
Expand Down
Loading