SVGLoader: Parse error when <use> tag has EITHER x or y but not BOTH

[nkallen]

Description

There is a minor bug in the SVG parser's handling of <use> tag x/y (translation) values. Please see the following threejs code for the location of the bug.

three.js/examples/jsm/loaders/SVGLoader.js

Line 1506 in f78c89f

const ty = parseFloatWithUnits( node.getAttribute( 'y' ) );

The code produces a NaN with tags like <use x=""> and <use y=""> but is fine with <use x="" y="">

Reproduction steps

Simply parsing the tags in the attached file returns invalid paths

   <use xlink:href="#DejaVuSans-34" x="83.789062"/>

Code

The issue is here

			if ( node.nodeName === 'use' && ( node.hasAttribute( 'x' ) || node.hasAttribute( 'y' ) ) ) {

// FIXME: add some conditionals
				const tx = parseFloatWithUnits( node.getAttribute( 'x' ) );
				const ty = parseFloatWithUnits( node.getAttribute( 'y' ) );

				transform.translate( tx, ty );

			}

Live example

• jsfiddle-latest-release WebGLRenderer

Just look at the console here -- I console.error when Number.isFinite returns false

Screenshots

No response

Version

latest

Device

No response

Browser

No response

OS

No response