super-three 0.160.0 → 0.161.0

package/examples/jsm/loaders/KTX2Loader.js

@@ -120,17 +120,32 @@ class KTX2Loader extends Loader {
 
 	}
 
+	async detectSupportAsync( renderer ) {
+
+		this.workerConfig = {
+			astcSupported: await renderer.hasFeatureAsync( 'texture-compression-astc' ),
+			etc1Supported: await renderer.hasFeatureAsync( 'texture-compression-etc1' ),
+			etc2Supported: await renderer.hasFeatureAsync( 'texture-compression-etc2' ),
+			dxtSupported: await renderer.hasFeatureAsync( 'texture-compression-bc' ),
+			bptcSupported: await renderer.hasFeatureAsync( 'texture-compression-bptc' ),
+			pvrtcSupported: await renderer.hasFeatureAsync( 'texture-compression-pvrtc' )
+		};
+
+		return this;
+
+	}
+
 	detectSupport( renderer ) {
 
 		if ( renderer.isWebGPURenderer === true ) {
 
 			this.workerConfig = {
 				astcSupported: renderer.hasFeature( 'texture-compression-astc' ),
-				etc1Supported: false,
+				etc1Supported: renderer.hasFeature( 'texture-compression-etc1' ),
 				etc2Supported: renderer.hasFeature( 'texture-compression-etc2' ),
 				dxtSupported: renderer.hasFeature( 'texture-compression-bc' ),
-				bptcSupported: false,
-				pvrtcSupported: false
+				bptcSupported: renderer.hasFeature( 'texture-compression-bptc' ),
+				pvrtcSupported: renderer.hasFeature( 'texture-compression-pvrtc' )
 			};
 
 		} else {
@@ -865,8 +880,8 @@ async function createRawTexture( container ) {
 	if ( UNCOMPRESSED_FORMATS.has( FORMAT_MAP[ vkFormat ] ) ) {
 
 		texture = container.pixelDepth === 0
-		? new DataTexture( mipmaps[ 0 ].data, container.pixelWidth, container.pixelHeight )
-		: new Data3DTexture( mipmaps[ 0 ].data, container.pixelWidth, container.pixelHeight, container.pixelDepth );
+			? new DataTexture( mipmaps[ 0 ].data, container.pixelWidth, container.pixelHeight )
+			: new Data3DTexture( mipmaps[ 0 ].data, container.pixelWidth, container.pixelHeight, container.pixelDepth );
 
 	} else {
 

package/examples/jsm/loaders/LUT3dlLoader.js

@@ -1,18 +1,42 @@
 // http://download.autodesk.com/us/systemdocs/help/2011/lustre/index.html?url=./files/WSc4e151a45a3b785a24c3d9a411df9298473-7ffd.htm,topicNumber=d0e9492
 // https://community.foundry.com/discuss/topic/103636/format-spec-for-3dl?mode=Post&postID=895258
+
 import {
-	Loader,
-	FileLoader,
+	ClampToEdgeWrapping,
 	DataTexture,
 	Data3DTexture,
+	FileLoader,
+	FloatType,
+	LinearFilter,
+	Loader,
 	RGBAFormat,
 	UnsignedByteType,
-	ClampToEdgeWrapping,
-	LinearFilter,
 } from 'three';
 
 export class LUT3dlLoader extends Loader {
 
+	constructor( manager ) {
+
+		super( manager );
+
+		this.type = UnsignedByteType;
+
+	}
+
+	setType( type ) {
+
+		if ( type !== UnsignedByteType && type !== FloatType ) {
+
+			throw new Error( 'LUT3dlLoader: Unsupported type' );
+
+		}
+
+		this.type = type;
+
+		return this;
+
+	}
+
 	load( url, onLoad, onProgress, onError ) {
 
 		const loader = new FileLoader( this.manager );
@@ -44,80 +68,88 @@ export class LUT3dlLoader extends Loader {
 
 	}
 
-	parse( str ) {
+	parse( input ) {
+
+		const regExpGridInfo = /^[\d ]+$/m;
+		const regExpDataPoints = /^([\d.e+-]+) +([\d.e+-]+) +([\d.e+-]+) *$/gm;
 
-		// remove empty lines and comment lints
-		str = str
-			.replace( /^#.*?(\n|\r)/gm, '' )
-			.replace( /^\s*?(\n|\r)/gm, '' )
-			.trim();
+		// The first line describes the positions of values on the LUT grid.
+		let result = regExpGridInfo.exec( input );
 
-		const lines = str.split( /[\n\r]+/g );
+		if ( result === null ) {
 
-		// first line is the positions on the grid that are provided by the LUT
-		const gridLines = lines[ 0 ].trim().split( /\s+/g ).map( e => parseFloat( e ) );
+			throw new Error( 'LUT3dlLoader: Missing grid information' );
+
+		}
+
+		const gridLines = result[ 0 ].trim().split( /\s+/g ).map( Number );
 		const gridStep = gridLines[ 1 ] - gridLines[ 0 ];
 		const size = gridLines.length;
+		const sizeSq = size ** 2;
 
-		for ( let i = 1, l = gridLines.length; i < l; i ++ ) {
+		for ( let i = 1, l = gridLines.length; i < l; ++ i ) {
 
 			if ( gridStep !== ( gridLines[ i ] - gridLines[ i - 1 ] ) ) {
 
-				throw new Error( 'LUT3dlLoader: Inconsistent grid size not supported.' );
+				throw new Error( 'LUT3dlLoader: Inconsistent grid size' );
 
 			}
 
 		}
 
-		const dataArray = new Array( size * size * size * 4 );
+		const dataFloat = new Float32Array( size ** 3 * 4 );
+		let maxValue = 0.0;
 		let index = 0;
-		let maxOutputValue = 0.0;
-		for ( let i = 1, l = lines.length; i < l; i ++ ) {
 
-			const line = lines[ i ].trim();
-			const split = line.split( /\s/g );
+		while ( ( result = regExpDataPoints.exec( input ) ) !== null ) {
+
+			const r = Number( result[ 1 ] );
+			const g = Number( result[ 2 ] );
+			const b = Number( result[ 3 ] );
 
-			const r = parseFloat( split[ 0 ] );
-			const g = parseFloat( split[ 1 ] );
-			const b = parseFloat( split[ 2 ] );
-			maxOutputValue = Math.max( maxOutputValue, r, g, b );
+			maxValue = Math.max( maxValue, r, g, b );
 
 			const bLayer = index % size;
 			const gLayer = Math.floor( index / size ) % size;
-			const rLayer = Math.floor( index / ( size * size ) ) % size;
+			const rLayer = Math.floor( index / ( sizeSq ) ) % size;
 
-			// b grows first, then g, then r
-			const pixelIndex = bLayer * size * size + gLayer * size + rLayer;
-			dataArray[ 4 * pixelIndex + 0 ] = r;
-			dataArray[ 4 * pixelIndex + 1 ] = g;
-			dataArray[ 4 * pixelIndex + 2 ] = b;
-			dataArray[ 4 * pixelIndex + 3 ] = 1.0;
-			index += 1;
+			// b grows first, then g, then r.
+			const d4 = ( bLayer * sizeSq + gLayer * size + rLayer ) * 4;
+			dataFloat[ d4 + 0 ] = r;
+			dataFloat[ d4 + 1 ] = g;
+			dataFloat[ d4 + 2 ] = b;
+
+			++ index;
 
 		}
 
-		// Find the apparent bit depth of the stored RGB values and map the
-		// values to [ 0, 255 ].
-		const bits = Math.ceil( Math.log2( maxOutputValue ) );
-		const maxBitValue = Math.pow( 2.0, bits );
-		for ( let i = 0, l = dataArray.length; i < l; i += 4 ) {
+		// Determine the bit depth to scale the values to [0.0, 1.0].
+		const bits = Math.ceil( Math.log2( maxValue ) );
+		const maxBitValue = Math.pow( 2, bits );
+
+		const data = this.type === UnsignedByteType ? new Uint8Array( dataFloat.length ) : dataFloat;
+		const scale = this.type === UnsignedByteType ? 255 : 1;
+
+		for ( let i = 0, l = data.length; i < l; i += 4 ) {
+
+			const i1 = i + 1;
+			const i2 = i + 2;
+			const i3 = i + 3;
 
-			const r = dataArray[ i + 0 ];
-			const g = dataArray[ i + 1 ];
-			const b = dataArray[ i + 2 ];
-			dataArray[ i + 0 ] = 255 * r / maxBitValue; // r
-			dataArray[ i + 1 ] = 255 * g / maxBitValue; // g
-			dataArray[ i + 2 ] = 255 * b / maxBitValue; // b
+			// Note: data is dataFloat when type is FloatType.
+			data[ i ] = dataFloat[ i ] / maxBitValue * scale;
+			data[ i1 ] = dataFloat[ i1 ] / maxBitValue * scale;
+			data[ i2 ] = dataFloat[ i2 ] / maxBitValue * scale;
+			data[ i3 ] = scale;
 
 		}
 
-		const data = new Uint8Array( dataArray );
 		const texture = new DataTexture();
 		texture.image.data = data;
 		texture.image.width = size;
 		texture.image.height = size * size;
 		texture.format = RGBAFormat;
-		texture.type = UnsignedByteType;
+		texture.type = this.type;
 		texture.magFilter = LinearFilter;
 		texture.minFilter = LinearFilter;
 		texture.wrapS = ClampToEdgeWrapping;
@@ -131,7 +163,7 @@ export class LUT3dlLoader extends Loader {
 		texture3D.image.height = size;
 		texture3D.image.depth = size;
 		texture3D.format = RGBAFormat;
-		texture3D.type = UnsignedByteType;
+		texture3D.type = this.type;
 		texture3D.magFilter = LinearFilter;
 		texture3D.minFilter = LinearFilter;
 		texture3D.wrapS = ClampToEdgeWrapping;

package/examples/jsm/loaders/LUTCubeLoader.js

@@ -1,18 +1,41 @@
 // https://wwwimages2.adobe.com/content/dam/acom/en/products/speedgrade/cc/pdfs/cube-lut-specification-1.0.pdf
 
 import {
-	Loader,
-	FileLoader,
-	Vector3,
+	ClampToEdgeWrapping,
 	DataTexture,
 	Data3DTexture,
-	UnsignedByteType,
-	ClampToEdgeWrapping,
+	FileLoader,
+	FloatType,
 	LinearFilter,
+	Loader,
+	UnsignedByteType,
+	Vector3,
 } from 'three';
 
 export class LUTCubeLoader extends Loader {
 
+	constructor( manager ) {
+
+		super( manager );
+
+		this.type = UnsignedByteType;
+
+	}
+
+	setType( type ) {
+
+		if ( type !== UnsignedByteType && type !== FloatType ) {
+
+			throw new Error( 'LUTCubeLoader: Unsupported type' );
+
+		}
+
+		this.type = type;
+
+		return this;
+
+	}
+
 	load( url, onLoad, onProgress, onError ) {
 
 		const loader = new FileLoader( this.manager );
@@ -44,72 +67,63 @@ export class LUTCubeLoader extends Loader {
 
 	}
 
-	parse( str ) {
+	parse( input ) {
 
-		// Remove empty lines and comments
-		str = str
-			.replace( /^#.*?(\n|\r)/gm, '' )
-			.replace( /^\s*?(\n|\r)/gm, '' )
-			.trim();
+		const regExpTitle = /TITLE +"([^"]*)"/;
+		const regExpSize = /LUT_3D_SIZE +(\d+)/;
+		const regExpDomainMin = /DOMAIN_MIN +([\d.]+) +([\d.]+) +([\d.]+)/;
+		const regExpDomainMax = /DOMAIN_MAX +([\d.]+) +([\d.]+) +([\d.]+)/;
+		const regExpDataPoints = /^([\d.e+-]+) +([\d.e+-]+) +([\d.e+-]+) *$/gm;
+
+		let result = regExpTitle.exec( input );
+		const title = ( result !== null ) ? result[ 1 ] : null;
+
+		result = regExpSize.exec( input );
+
+		if ( result === null ) {
+
+			throw new Error( 'LUTCubeLoader: Missing LUT_3D_SIZE information' );
+
+		}
+
+		const size = Number( result[ 1 ] );
+		const length = size ** 3 * 4;
+		const data = this.type === UnsignedByteType ? new Uint8Array( length ) : new Float32Array( length );
 
-		let title = null;
-		let size = null;
 		const domainMin = new Vector3( 0, 0, 0 );
 		const domainMax = new Vector3( 1, 1, 1 );
 
-		const lines = str.split( /[\n\r]+/g );
-		let data = null;
-
-		let currIndex = 0;
-		for ( let i = 0, l = lines.length; i < l; i ++ ) {
-
-			const line = lines[ i ].trim();
-			const split = line.split( /\s/g );
-
-			switch ( split[ 0 ] ) {
-
-				case 'TITLE':
-					title = line.substring( 7, line.length - 1 );
-					break;
-				case 'LUT_3D_SIZE':
-					// TODO: A .CUBE LUT file specifies floating point values and could be represented with
-					// more precision than can be captured with Uint8Array.
-					const sizeToken = split[ 1 ];
-					size = parseFloat( sizeToken );
-					data = new Uint8Array( size * size * size * 4 );
-					break;
-				case 'DOMAIN_MIN':
-					domainMin.x = parseFloat( split[ 1 ] );
-					domainMin.y = parseFloat( split[ 2 ] );
-					domainMin.z = parseFloat( split[ 3 ] );
-					break;
-				case 'DOMAIN_MAX':
-					domainMax.x = parseFloat( split[ 1 ] );
-					domainMax.y = parseFloat( split[ 2 ] );
-					domainMax.z = parseFloat( split[ 3 ] );
-					break;
-				default:
-					const r = parseFloat( split[ 0 ] );
-					const g = parseFloat( split[ 1 ] );
-					const b = parseFloat( split[ 2 ] );
-
-					if (
-						r > 1.0 || r < 0.0 ||
-						g > 1.0 || g < 0.0 ||
-						b > 1.0 || b < 0.0
-					) {
-
-						throw new Error( 'LUTCubeLoader : Non normalized values not supported.' );
-
-					}
-
-					data[ currIndex + 0 ] = r * 255;
-					data[ currIndex + 1 ] = g * 255;
-					data[ currIndex + 2 ] = b * 255;
-					data[ currIndex + 3 ] = 255;
-					currIndex += 4;
+		result = regExpDomainMin.exec( input );
 
-			}
+		if ( result !== null ) {
+
+			domainMin.set( Number( result[ 1 ] ), Number( result[ 2 ] ), Number( result[ 3 ] ) );
+
+		}
+
+		result = regExpDomainMax.exec( input );
+
+		if ( result !== null ) {
+
+			domainMax.set( Number( result[ 1 ] ), Number( result[ 2 ] ), Number( result[ 3 ] ) );
+
+		}
+
+		if ( domainMin.x > domainMax.x || domainMin.y > domainMax.y || domainMin.z > domainMax.z ) {
+
+			throw new Error( 'LUTCubeLoader: Invalid input domain' );
+
+		}
+
+		const scale = this.type === UnsignedByteType ? 255 : 1;
+		let i = 0;
+
+		while ( ( result = regExpDataPoints.exec( input ) ) !== null ) {
+
+			data[ i ++ ] = Number( result[ 1 ] ) * scale;
+			data[ i ++ ] = Number( result[ 2 ] ) * scale;
+			data[ i ++ ] = Number( result[ 3 ] ) * scale;
+			data[ i ++ ] = scale;
 
 		}
 
@@ -117,7 +131,7 @@ export class LUTCubeLoader extends Loader {
 		texture.image.data = data;
 		texture.image.width = size;
 		texture.image.height = size * size;
-		texture.type = UnsignedByteType;
+		texture.type = this.type;
 		texture.magFilter = LinearFilter;
 		texture.minFilter = LinearFilter;
 		texture.wrapS = ClampToEdgeWrapping;
@@ -130,7 +144,7 @@ export class LUTCubeLoader extends Loader {
 		texture3D.image.width = size;
 		texture3D.image.height = size;
 		texture3D.image.depth = size;
-		texture3D.type = UnsignedByteType;
+		texture3D.type = this.type;
 		texture3D.magFilter = LinearFilter;
 		texture3D.minFilter = LinearFilter;
 		texture3D.wrapS = ClampToEdgeWrapping;

package/examples/jsm/loaders/LUTImageLoader.js

@@ -12,9 +12,10 @@ import {
 export class LUTImageLoader extends Loader {
 
 	constructor( flipVertical = false ) {
-		//The NeutralLUT.png has green at the bottom for Unreal ang green at the top for Unity URP Color Lookup 
+
+		//The NeutralLUT.png has green at the bottom for Unreal ang green at the top for Unity URP Color Lookup
 		//post-processing. If you're using lut image strips from a Unity pipeline then pass true to the constructor
-		
+
 		super();
 
 		this.flip = flipVertical;

package/examples/jsm/loaders/MaterialXLoader.js

@@ -6,9 +6,10 @@ import {
 } from 'three';
 
 import {
-	MeshPhysicalNodeMaterial,
+	MeshBasicNodeMaterial, MeshPhysicalNodeMaterial,
 	float, bool, int, vec2, vec3, vec4, color, texture,
-	positionLocal,
+	positionLocal, positionWorld, uv, vertexColor,
+	normalLocal, normalWorld, tangentLocal, tangentWorld,
 	add, sub, mul, div, mod, abs, sign, floor, ceil, round, pow, sin, cos, tan,
 	asin, acos, atan2, sqrt, exp, clamp, min, max, normalize, length, dot, cross, normalMap,
 	remap, smoothstep, luminance, mx_rgbtohsv, mx_hsvtorgb,
@@ -39,26 +40,34 @@ class MXElement {
 
 // Ref: https://github.com/mrdoob/three.js/issues/24674
 
+const mx_add = ( in1, in2 = float( 0 ) ) => add( in1, in2 );
+const mx_subtract = ( in1, in2 = float( 0 ) ) => sub( in1, in2 );
+const mx_multiply = ( in1, in2 = float( 1 ) ) => mul( in1, in2 );
+const mx_divide = ( in1, in2 = float( 1 ) ) => div( in1, in2 );
+const mx_modulo = ( in1, in2 = float( 1 ) ) => mod( in1, in2 );
+const mx_power = ( in1, in2 = float( 1 ) ) => pow( in1, in2 );
+const mx_atan2 = ( in1 = float( 0 ), in2 = float( 1 ) ) => atan2( in1, in2 );
+
 const MXElements = [
 
 	// << Math >>
-	new MXElement( 'add', add, [ 'in1', 'in2' ] ),
-	new MXElement( 'subtract', sub, [ 'in1', 'in2' ] ),
-	new MXElement( 'multiply', mul, [ 'in1', 'in2' ] ),
-	new MXElement( 'divide', div, [ 'in1', 'in2' ] ),
-	new MXElement( 'modulo', mod, [ 'in1', 'in2' ] ),
+	new MXElement( 'add', mx_add, [ 'in1', 'in2' ] ),
+	new MXElement( 'subtract', mx_subtract, [ 'in1', 'in2' ] ),
+	new MXElement( 'multiply', mx_multiply, [ 'in1', 'in2' ] ),
+	new MXElement( 'divide', mx_divide, [ 'in1', 'in2' ] ),
+	new MXElement( 'modulo', mx_modulo, [ 'in1', 'in2' ] ),
 	new MXElement( 'absval', abs, [ 'in1', 'in2' ] ),
 	new MXElement( 'sign', sign, [ 'in1', 'in2' ] ),
 	new MXElement( 'floor', floor, [ 'in1', 'in2' ] ),
 	new MXElement( 'ceil', ceil, [ 'in1', 'in2' ] ),
 	new MXElement( 'round', round, [ 'in1', 'in2' ] ),
-	new MXElement( 'power', pow, [ 'in1', 'in2' ] ),
+	new MXElement( 'power', mx_power, [ 'in1', 'in2' ] ),
 	new MXElement( 'sin', sin, [ 'in' ] ),
 	new MXElement( 'cos', cos, [ 'in' ] ),
 	new MXElement( 'tan', tan, [ 'in' ] ),
 	new MXElement( 'asin', asin, [ 'in' ] ),
 	new MXElement( 'acos', acos, [ 'in' ] ),
-	new MXElement( 'atan2', atan2, [ 'in1', 'in2' ] ),
+	new MXElement( 'atan2', mx_atan2, [ 'in1', 'in2' ] ),
 	new MXElement( 'sqrt', sqrt, [ 'in' ] ),
 	//new MtlXElement( 'ln', ... ),
 	new MXElement( 'exp', exp, [ 'in' ] ),
@@ -141,6 +150,20 @@ class MaterialXLoader extends Loader {
 
 	load( url, onLoad, onProgress, onError ) {
 
+		const _onError = function ( e ) {
+
+			if ( onError ) {
+
+				onError( e );
+
+			} else {
+
+				console.error( e );
+
+			}
+
+		};
+
 		new FileLoader( this.manager )
 			.setPath( this.path )
 			.load( url, async ( text ) => {
@@ -151,11 +174,11 @@ class MaterialXLoader extends Loader {
 
 				} catch ( e ) {
 
-					onError( e );
+					_onError( e );
 
 				}
 
-			}, onProgress, onError );
+			}, onProgress, _onError );
 
 		return this;
 
@@ -312,7 +335,17 @@ class MaterialXNode {
 
 		const filePrefix = this.getRecursiveAttribute( 'fileprefix' ) || '';
 
-		const texture = this.materialX.textureLoader.load( filePrefix + this.value );
+		let loader = this.materialX.textureLoader;
+		const uri = filePrefix + this.value;
+
+		if ( uri ) {
+
+			const handler = this.materialX.manager.getHandler( uri );
+			if ( handler !== null ) loader = handler;
+
+		}
+
+		const texture = loader.load( uri );
 		texture.wrapS = texture.wrapT = RepeatWrapping;
 		texture.flipY = false;
 
@@ -376,7 +409,32 @@ class MaterialXNode {
 
 			} else if ( element === 'position' ) {
 
-				node = positionLocal;
+				const space = this.getAttribute( 'space' );
+				node = space === 'world' ? positionWorld : positionLocal;
+
+			} else if ( element === 'normal' ) {
+
+				const space = this.getAttribute( 'space' );
+				node = space === 'world' ? normalWorld : normalLocal;
+
+			} else if ( element === 'tangent' ) {
+
+				const space = this.getAttribute( 'space' );
+				node = space === 'world' ? tangentWorld : tangentLocal;
+
+			} else if ( element === 'texcoord' ) {
+
+				const indexNode = this.getChildByName( 'index' );
+				const index = indexNode ? parseInt( indexNode.value ) : 0;
+
+				node = uv( index );
+
+			} else if ( element === 'geomcolor' ) {
+
+				const indexNode = this.getChildByName( 'index' );
+				const index = indexNode ? parseInt( indexNode.value ) : 0;
+
+				node = vertexColor( index );
 
 			} else if ( element === 'tiledimage' ) {
 
@@ -597,7 +655,7 @@ class MaterialXNode {
 		let emissiveNode = null;
 
 		if ( inputs.emission ) emissiveNode = inputs.emission;
-		if ( inputs.emissionColor )  {
+		if ( inputs.emissionColor ) {
 
 			emissiveNode = emissiveNode ? mul( emissiveNode, inputs.emissionColor ) : emissiveNode;
 
@@ -639,7 +697,28 @@ class MaterialXNode {
 
 	}
 
-	toMaterial() {
+	toBasicMaterial() {
+
+		const material = new MeshBasicNodeMaterial();
+		material.name = this.name;
+
+		for ( const nodeX of this.children.toReversed() ) {
+
+			if ( nodeX.name === 'out' ) {
+
+				material.colorNode = nodeX.getNode();
+
+				break;
+
+			}
+
+		}
+
+		return material;
+
+	}
+
+	toPhysicalMaterial() {
 
 		const material = new MeshPhysicalNodeMaterial();
 		material.name = this.name;
@@ -659,14 +738,34 @@ class MaterialXNode {
 
 		const materials = {};
 
+		let isUnlit = true;
+
 		for ( const nodeX of this.children ) {
 
 			if ( nodeX.element === 'surfacematerial' ) {
 
-				const material = nodeX.toMaterial();
+				const material = nodeX.toPhysicalMaterial();
 
 				materials[ material.name ] = material;
 
+				isUnlit = false;
+
+			}
+
+		}
+
+		if ( isUnlit ) {
+
+			for ( const nodeX of this.children ) {
+
+				if ( nodeX.element === 'nodegraph' ) {
+
+					const material = nodeX.toBasicMaterial();
+
+					materials[ material.name ] = material;
+
+				}
+
 			}
 
 		}

package/examples/jsm/loaders/SVGLoader.js

@@ -2924,8 +2924,8 @@ class SVGLoader extends Loader {
 			addVertex( currentPointL, u1, 0 );
 
 			addVertex( lastPointR, u0, 1 );
-			addVertex( currentPointL, u1, 1 );
-			addVertex( currentPointR, u1, 0 );
+			addVertex( currentPointL, u1, 0 );
+			addVertex( currentPointR, u1, 1 );
 
 		}
 
@@ -3082,7 +3082,8 @@ class SVGLoader extends Loader {
 						} else {
 
 							tempV2_3.toArray( vertices, 1 * 3 );
-							tempV2_3.toArray( vertices, 3 * 3 );
+							// using tempV2_4 to update 3rd vertex if the uv.y of 3rd vertex is 1
+							uvs[ 3 * 2 + 1 ] === 1 ? tempV2_4.toArray( vertices, 3 * 3 ) : tempV2_3.toArray( vertices, 3 * 3 );
 							tempV2_4.toArray( vertices, 0 * 3 );
 
 						}

package/examples/jsm/loaders/VRMLLoader.js

@@ -126,7 +126,7 @@ class VRMLLoader extends Loader {
 			// from http://gun.teipir.gr/VRML-amgem/spec/part1/concepts.html#SyntaxBasics
 
 			const RouteIdentifier = createToken( { name: 'RouteIdentifier', pattern: /[^\x30-\x39\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d][^\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d]*[\.][^\x30-\x39\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d][^\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d]*/ } );
-			const Identifier = createToken( { name: 'Identifier', pattern: /[^\x30-\x39\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d][^\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d]*/, longer_alt: RouteIdentifier } );
+			const Identifier = createToken( { name: 'Identifier', pattern: /[^\x30-\x39\0-\x20\x22\x27\x23\x2b\x2c\x2d\x2e\x5b\x5d\x5c\x7b\x7d]([^\0-\x20\x22\x27\x23\x2b\x2c\x2e\x5b\x5d\x5c\x7b\x7d])*/, longer_alt: RouteIdentifier } );
 
 			// from http://gun.teipir.gr/VRML-amgem/spec/part1/nodesRef.html