Skip to content

Commit 148f9b1

Browse files
Examples: Remove need for manually assigning Line2 material resolution (#28343)
* Remove need for assigning line2 material resolution * Move use to `Line2` object * Fix wireframe mesh * Move callback from `Line2` to `LineSegments2` * Remove another use of "resolution" * Remove comments * Multiply out the pixel ratio * use "getViewport" * Remove outdated comments * Accommodate WebGPURenderer * Accommodate WebGPURenderer --------- Co-authored-by: WestLangley <WestLangley@users.noreply.github.com>
1 parent f682d5b commit 148f9b1

File tree

6 files changed

+32
-36
lines changed

6 files changed

+32
-36
lines changed

examples/jsm/lines/LineMaterial.js

Lines changed: 1 addition & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,11 @@
1-
/**
2-
* parameters = {
3-
* color: <hex>,
4-
* linewidth: <float>,
5-
* dashed: <boolean>,
6-
* dashScale: <float>,
7-
* dashSize: <float>,
8-
* dashOffset: <float>,
9-
* gapSize: <float>,
10-
* resolution: <Vector2>, // to be set by renderer
11-
* }
12-
*/
13-
141
import {
152
ShaderLib,
163
ShaderMaterial,
174
UniformsLib,
185
UniformsUtils,
19-
Vector2
6+
Vector2,
207
} from 'three';
218

22-
239
UniformsLib.line = {
2410

2511
worldUnits: { value: 1 },

examples/jsm/lines/LineSegments2.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ import {
1313
import { LineSegmentsGeometry } from '../lines/LineSegmentsGeometry.js';
1414
import { LineMaterial } from '../lines/LineMaterial.js';
1515

16+
const _viewport = new Vector4();
17+
1618
const _start = new Vector3();
1719
const _end = new Vector3();
1820

@@ -356,6 +358,19 @@ class LineSegments2 extends Mesh {
356358

357359
}
358360

361+
onBeforeRender( renderer ) {
362+
363+
const uniforms = this.material.uniforms;
364+
365+
if ( uniforms && uniforms.resolution ) {
366+
367+
renderer.getViewport( _viewport );
368+
this.material.uniforms.resolution.value.set( _viewport.z, _viewport.w );
369+
370+
}
371+
372+
}
373+
359374
}
360375

361376
export { LineSegments2 };

examples/jsm/lines/Wireframe.js

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,15 @@ import {
22
InstancedInterleavedBuffer,
33
InterleavedBufferAttribute,
44
Mesh,
5-
Vector3
5+
Vector3,
6+
Vector4
67
} from 'three';
78
import { LineSegmentsGeometry } from '../lines/LineSegmentsGeometry.js';
89
import { LineMaterial } from '../lines/LineMaterial.js';
910

1011
const _start = new Vector3();
1112
const _end = new Vector3();
13+
const _viewport = new Vector4();
1214

1315
class Wireframe extends Mesh {
1416

@@ -51,6 +53,19 @@ class Wireframe extends Mesh {
5153

5254
}
5355

56+
onBeforeRender( renderer ) {
57+
58+
const uniforms = this.material.uniforms;
59+
60+
if ( uniforms && uniforms.resolution ) {
61+
62+
renderer.getViewport( _viewport );
63+
this.material.uniforms.resolution.value.set( _viewport.z, _viewport.w );
64+
65+
}
66+
67+
}
68+
5469
}
5570

5671
export { Wireframe };

examples/webgl_lines_fat.html

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,6 @@
108108
linewidth: 5, // in world units with size attenuation, pixels otherwise
109109
vertexColors: true,
110110

111-
//resolution: // to be set by renderer, eventually
112111
dashed: false,
113112
alphaToCoverage: true,
114113

@@ -175,9 +174,6 @@
175174

176175
controls.update();
177176

178-
// renderer will set this eventually
179-
matLine.resolution.set( window.innerWidth, window.innerHeight ); // resolution of the viewport
180-
181177
gpuPanel.startQuery();
182178
renderer.render( scene, camera );
183179
gpuPanel.endQuery();
@@ -197,9 +193,6 @@
197193
camera2.position.copy( camera.position );
198194
camera2.quaternion.copy( camera.quaternion );
199195

200-
// renderer will set this eventually
201-
matLine.resolution.set( insetWidth, insetHeight ); // resolution of the inset viewport
202-
203196
renderer.render( scene, camera2 );
204197

205198
renderer.setScissorTest( false );

examples/webgl_lines_fat_raycasting.html

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,6 @@
6060
worldUnits: true,
6161
vertexColors: true,
6262

63-
//resolution: // to be set by renderer, eventually
6463
alphaToCoverage: true,
6564

6665
} );
@@ -75,7 +74,6 @@
7574
opacity: 0.2,
7675
depthTest: false,
7776
visible: false,
78-
//resolution: // to be set by renderer, eventually
7977

8078
} );
8179

@@ -213,10 +211,6 @@
213211

214212
renderer.setSize( window.innerWidth, window.innerHeight );
215213

216-
// renderer will set this eventually
217-
matLine.resolution.set( window.innerWidth, window.innerHeight );
218-
matThresholdLine.resolution.set( window.innerWidth, window.innerHeight );
219-
220214
}
221215

222216
function onPointerMove( event ) {

examples/webgl_lines_fat_wireframe.html

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,6 @@
7878

7979
color: 0x4080ff,
8080
linewidth: 5, // in pixels
81-
//resolution: // to be set by renderer, eventually
8281
dashed: false
8382

8483
} );
@@ -136,9 +135,6 @@
136135

137136
renderer.setViewport( 0, 0, window.innerWidth, window.innerHeight );
138137

139-
// renderer will set this eventually
140-
matLine.resolution.set( window.innerWidth, window.innerHeight ); // resolution of the viewport
141-
142138
renderer.render( scene, camera );
143139

144140
// inset scene
@@ -156,9 +152,6 @@
156152
camera2.position.copy( camera.position );
157153
camera2.quaternion.copy( camera.quaternion );
158154

159-
// renderer will set this eventually
160-
matLine.resolution.set( insetWidth, insetHeight ); // resolution of the inset viewport
161-
162155
renderer.render( scene, camera2 );
163156

164157
renderer.setScissorTest( false );

0 commit comments

Comments
 (0)