feat: Remove need for manually assigning Line2 material resolution

mrdoob/three.js#28343

Author: RodrigoHamuy

src/lines/LineMaterial.js

@@ -7,7 +7,6 @@
  *  dashSize: <float>,
  *  dashOffset: <float>,
  *  gapSize: <float>,
- *  resolution: <Vector2>, // to be set by renderer
  * }
  */
 

src/lines/LineSegments2.js

@@ -13,6 +13,8 @@ import {
 import { LineSegmentsGeometry } from '../lines/LineSegmentsGeometry'
 import { LineMaterial } from '../lines/LineMaterial'
 
+const _viewport = new Vector4();
+
 const _start = new Vector3()
 const _end = new Vector3()
 
@@ -300,6 +302,19 @@ class LineSegments2 extends Mesh {
       raycastScreenSpace(this, camera, intersects)
     }
   }
+
+  onBeforeRender(renderer) {
+
+    const uniforms = this.material.uniforms;
+
+    if (uniforms && uniforms.resolution) {
+
+      renderer.getViewport(_viewport);
+      this.material.uniforms.resolution.value.set(_viewport.z, _viewport.w);
+
+    }
+
+  }
 }
 
 export { LineSegments2 }

src/lines/Wireframe.js

@@ -1,9 +1,10 @@
-import { InstancedInterleavedBuffer, InterleavedBufferAttribute, Mesh, Vector3 } from 'three'
+import { InstancedInterleavedBuffer, InterleavedBufferAttribute, Mesh, Vector3, Vector4 } from 'three'
 import { LineSegmentsGeometry } from '../lines/LineSegmentsGeometry'
 import { LineMaterial } from '../lines/LineMaterial'
 
 const _start = new Vector3()
 const _end = new Vector3()
+const _viewport = new Vector4();
 
 class Wireframe extends Mesh {
   constructor(geometry = new LineSegmentsGeometry(), material = new LineMaterial({ color: Math.random() * 0xffffff })) {
@@ -38,6 +39,19 @@ class Wireframe extends Mesh {
 
     return this
   }
+
+	onBeforeRender( renderer ) {
+
+		const uniforms = this.material.uniforms;
+
+		if ( uniforms && uniforms.resolution ) {
+
+			renderer.getViewport( _viewport );
+			this.material.uniforms.resolution.value.set( _viewport.z, _viewport.w );
+
+		}
+
+	}
 }
 
 export { Wireframe }