SVGLoader: Honor scale in strokeWidth. (#33411)

Author: Mugen87

examples/jsm/loaders/SVGLoader.js

@@ -238,7 +238,10 @@ class SVGLoader extends Loader {
 
 				paths.push( path );
 
-				path.userData = { node: node, style: style };
+				const pathStyle = Object.assign( {}, style );
+				pathStyle.strokeWidth = style.strokeWidth * getTransformScale( currentTransform );
+
+				path.userData = { node: node, style: pathStyle };
 
 			}
 
@@ -1875,6 +1878,14 @@ class SVGLoader extends Loader {
 
 		}
 
+		function getTransformScale( m ) {
+
+			const te = m.elements;
+			const det = te[ 0 ] * te[ 4 ] - te[ 1 ] * te[ 3 ];
+			return Math.sqrt( Math.abs( det ) );
+
+		}
+
 		// Calculates the eigensystem of a real symmetric 2x2 matrix
 		//    [ A  B ]
 		//    [ B  C ]

examples/models/svg/styled-paths.svg

@@ -110,6 +110,7 @@
 					'Defs4': 'models/svg/tests/testDefs/defs4.svg',
 					'Defs5': 'models/svg/tests/testDefs/defs5.svg',
 					'Style CSS inside defs': 'models/svg/style-css-inside-defs.svg',
+					'Styled Paths': 'models/svg/styled-paths.svg',
 					'Multiple CSS classes': 'models/svg/multiple-css-classes.svg',
 					'Zero Radius': 'models/svg/zero-radius.svg',
 					'Styles in svg tag': 'models/svg/tests/styles.svg',