Skip to content

Commit af1132f

Browse files
author
aardgoose
committed
rebase
1 parent a9ca9fd commit af1132f

File tree

9 files changed

+51
-30
lines changed

9 files changed

+51
-30
lines changed

‎examples/webgpu_multiple_canvases.html‎

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -40,9 +40,9 @@
4040
<script type="importmap">
4141
{
4242
"imports": {
43-
"three": "../build/three.module.js",
44-
"three/addons/": "./jsm/",
45-
"three/nodes": "./jsm/nodes/Nodes.js"
43+
"three": "../build/three.webgpu.js",
44+
"three/tsl": "../build/three.webgpu.js",
45+
"three/addons/": "./jsm/"
4646
}
4747
}
4848
</script>
@@ -51,14 +51,10 @@
5151

5252
import * as THREE from 'three';
5353

54-
import { MeshPhongNodeMaterial } from 'three/nodes';
5554
import WebGPU from 'three/addons/capabilities/WebGPU.js';
5655

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

59-
import WebGPURenderer from 'three/addons/renderers/webgpu/WebGPURenderer.js';
60-
import CanvasRenderTarget from 'three/addons/renderers/common/CanvasRenderTarget.js';
61-
6258
import Stats from 'three/addons/libs/stats.module.js';
6359

6460
let camera, renderer;
@@ -111,7 +107,7 @@
111107

112108
function makeCanvasRenderTarget( container ) {
113109

114-
const canvasRenderTarget = new CanvasRenderTarget( { antialias: Math.random() < 0.5 ? true : false } );
110+
const canvasRenderTarget = new THREE.CanvasRenderTarget( { antialias: Math.random() < 0.5 ? true : false } );
115111

116112
canvasRenderTarget.outputColorSpace = colorSpaces[ Math.floor( Math.random() * colorSpaces.length ) ];
117113

@@ -178,7 +174,7 @@
178174

179175
}
180176

181-
renderer = new WebGPURenderer();
177+
renderer = new THREE.WebGPURenderer();
182178
renderer.setAnimationLoop( render );
183179

184180
stats = new Stats();
@@ -198,12 +194,12 @@
198194
);
199195

200196
materials.push(
201-
new MeshPhongNodeMaterial( { color: 0x00ee00 } ),
202-
new MeshPhongNodeMaterial( { color: 0xee0000 } ),
203-
new MeshPhongNodeMaterial( { color: 0xeeee00 } ),
204-
new MeshPhongNodeMaterial( { color: 0x00eeee } ),
205-
new MeshPhongNodeMaterial( { color: 0xee00ee } ),
206-
new MeshPhongNodeMaterial( { color: 0x0000ee } ),
197+
new THREE.MeshPhongNodeMaterial( { color: 0x00ee00 } ),
198+
new THREE.MeshPhongNodeMaterial( { color: 0xee0000 } ),
199+
new THREE.MeshPhongNodeMaterial( { color: 0xeeee00 } ),
200+
new THREE.MeshPhongNodeMaterial( { color: 0x00eeee } ),
201+
new THREE.MeshPhongNodeMaterial( { color: 0xee00ee } ),
202+
new THREE.MeshPhongNodeMaterial( { color: 0x0000ee } ),
207203
);
208204

209205
}

‎src/Three.WebGPU.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -161,6 +161,7 @@ export * from './constants.js';
161161
export * from './Three.Legacy.js';
162162

163163
export { default as WebGPURenderer } from './renderers/webgpu/WebGPURenderer.js';
164+
export { default as CanvasRenderTarget } from './renderers/common/CanvasRenderTarget.js';
164165
export { default as QuadMesh } from './renderers/common/QuadMesh.js';
165166
export { default as PMREMGenerator } from './renderers/common/extras/PMREMGenerator.js';
166167
export { default as PostProcessing } from './renderers/common/PostProcessing.js';

‎src/renderers/common/Backend.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
let color4 = null;
22

33
import Color4 from './Color4.js';
4-
import { Vector2 } from '../../math/Vector2.js';
5-
import { Vector4 } from '../../math/Vector4.js';
64
import { createCanvasElement } from '../../utils.js';
75
import { REVISION } from '../../constants.js';
86

‎src/renderers/common/CanvasRenderTarget.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
import { EventDispatcher, Vector4, REVISION, createCanvasElement, SRGBColorSpace } from 'three';
1+
import { createCanvasElement } from '../../utils.js';
2+
import { REVISION, SRGBColorSpace } from '../../constants';
3+
import { EventDispatcher } from '../../core/EventDispatcher';
4+
import { Vector4 } from '../../math/Vector4.js';
25

36
class CanvasRenderTarget extends EventDispatcher {
47

‎src/renderers/common/Renderer.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ import { Vector2 } from '../../math/Vector2.js';
2525
import { Vector3 } from '../../math/Vector3.js';
2626
import { Vector4 } from '../../math/Vector4.js';
2727
import { RenderTarget } from '../../core/RenderTarget.js';
28-
import { DoubleSide, BackSide, FrontSide, SRGBColorSpace, NoColorSpace, NoToneMapping, LinearFilter, LinearSRGBColorSpace, HalfFloatType, RGBAFormat } from '../../constants.js';
28+
import { DoubleSide, BackSide, FrontSide, NoColorSpace, NoToneMapping, LinearFilter, LinearSRGBColorSpace, HalfFloatType, RGBAFormat } from '../../constants.js';
2929

3030
const _scene = new Scene();
3131
const _drawingBufferSize = new Vector2();
@@ -927,7 +927,7 @@ class Renderer {
927927

928928
}
929929

930-
const renderTarget = this._renderTarget.isCanvasRenderTarget !== true ? this._renderTarget : this._getFrameBufferTarget();
930+
const renderTarget = this._renderTarget.isCanvasRenderTarget === true ? this._getFrameBufferTarget() : this._renderTarget;
931931

932932
let renderTargetData = null;
933933

@@ -941,7 +941,7 @@ class Renderer {
941941

942942
this.backend.clear( color, depth, stencil, renderTargetData, renderTarget );
943943

944-
if ( renderTarget !== null && this._renderTarget === null ) {
944+
if ( renderTarget !== null && this._renderTarget.isCanvasRenderTarget === true ) {
945945

946946
// If a color space transform or tone mapping is required,
947947
// the clear operation clears the intermediate renderTarget texture, but does not update the screen canvas.

‎src/renderers/webgpu/WebGPUBackend.js‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ class WebGPUBackend extends Backend {
119119
canvasRenderTargetData.contextGPU = context;
120120
canvasRenderTargetData.ready = true;
121121

122-
};
122+
}
123123

124124
get coordinateSystem() {
125125

@@ -147,7 +147,9 @@ class WebGPUBackend extends Backend {
147147

148148
if ( ! canvasRenderTargetData.ready ) this._configureContext( canvasRenderTarget );
149149

150-
let { contextGPU, descriptor } = canvasRenderTargetData;
150+
const contextGPU = canvasRenderTargetData.contextGPU;
151+
152+
let descriptor = canvasRenderTargetData.descriptor;
151153

152154
if ( canvasRenderTarget.version !== canvasRenderTargetData.version ) {
153155

@@ -997,7 +999,7 @@ class WebGPUBackend extends Backend {
997999

9981000
const renderContext = renderObject.context;
9991001

1000-
const sampleCount = renderContext.sampleCount;
1002+
const sampleCount = utils.getSampleCount( renderContext.sampleCount );
10011003
const colorSpace = renderContext.colorSpace;
10021004
const colorFormat = utils.getCurrentColorFormat( renderContext );
10031005
const depthStencilFormat = utils.getCurrentDepthStencilFormat( renderContext );
@@ -1062,7 +1064,7 @@ class WebGPUBackend extends Backend {
10621064
material.stencilFail, material.stencilZFail, material.stencilZPass,
10631065
material.stencilFuncMask, material.stencilWriteMask,
10641066
material.side,
1065-
renderContext.sampleCount,
1067+
utils.getSampleCount( renderContext.sampleCount ),
10661068
renderContext.colorSpace, utils.getCurrentColorFormat( renderContext ), utils.getCurrentDepthStencilFormat( renderContext ),
10671069
utils.getPrimitiveTopology( object, material ),
10681070
renderObject.clippingContextVersion

‎src/renderers/webgpu/utils/WebGPUPipelineUtils.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ class WebGPUPipelineUtils {
2525

2626
_getSampleCount( renderObjectContext ) {
2727

28-
return this.backend.utils.getSampleCountRenderContext( renderObjectContext );
28+
return this.backend.utils.getSampleCount( renderObjectContext.sampleCount );
2929

3030
}
3131

@@ -120,7 +120,7 @@ class WebGPUPipelineUtils {
120120
const depthCompare = this._getDepthCompare( material );
121121
const depthStencilFormat = utils.getCurrentDepthStencilFormat( context );
122122

123-
const sampleCount = context.sampleCount;
123+
const sampleCount = this._getSampleCount( context );
124124

125125
const pipelineDescriptor = {
126126
label: 'renderPipeline',
@@ -178,7 +178,7 @@ class WebGPUPipelineUtils {
178178

179179
const depthStencilFormat = utils.getCurrentDepthStencilFormat( renderContext );
180180
const colorFormat = utils.getCurrentColorFormat( renderContext );
181-
const sampleCount = renderContext.sampleCount;
181+
const sampleCount = this._getSampleCount( renderContext );
182182

183183
const descriptor = {
184184
label: 'renderBundleEncoder',

‎src/renderers/webgpu/utils/WebGPUTextureUtils.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
import WebGPUTexturePassUtils from './WebGPUTexturePassUtils.js';
66

77
import {
8-
ByteType, ShortType, CubeTexture, Texture, Vector2,
8+
ByteType, ShortType,
99
NearestFilter, NearestMipmapNearestFilter, NearestMipmapLinearFilter,
1010
RepeatWrapping, MirroredRepeatWrapping,
1111
RGB_ETC2_Format, RGBA_ETC2_EAC_Format,
@@ -16,7 +16,7 @@ import {
1616
CubeReflectionMapping, CubeRefractionMapping, EquirectangularReflectionMapping, EquirectangularRefractionMapping
1717
} from '../../../constants.js';
1818
import { CubeTexture } from '../../../textures/CubeTexture.js';
19-
import { DepthTexture } from '../../../textures/DepthTexture.js';
19+
import { Vector2 } from '../../../math/Vector2.js';
2020
import { Texture } from '../../../textures/Texture.js';
2121

2222
const _compareToWebGPU = {

‎src/renderers/webgpu/utils/WebGPUUtils.js‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,27 @@ class WebGPUUtils {
6464

6565
}
6666

67+
getSampleCount( sampleCount ) {
68+
69+
let count = 1;
70+
71+
if ( sampleCount > 1 ) {
72+
73+
// WebGPU only supports power-of-two sample counts and 2 is not a valid value
74+
count = Math.pow( 2, Math.floor( Math.log2( sampleCount ) ) );
75+
76+
if ( count === 2 ) {
77+
78+
count = 4;
79+
80+
}
81+
82+
}
83+
84+
return count;
85+
86+
}
87+
6788
}
6889

6990
export default WebGPUUtils;

0 commit comments

Comments
 (0)