Skip to content

Fixes SVGLoader arc parsing with zero radius path commands. #20644

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Nov 10, 2020
Merged

Fixes SVGLoader arc parsing with zero radius path commands. #20644

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0ac84c5
Fixes SVGLoader arc parsing with zero radius path commands. See #20641
gregzanch Nov 8, 2020
139866d
move check into parse arc function
gregzanch Nov 8, 2020
66b7db9
move changes into js directory rather than jsm
gregzanch Nov 8, 2020
f39aa7f
fix formatting on if statements
gregzanch Nov 10, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions examples/js/loaders/SVGLoader.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -386,6 +386,9 @@ THREE.SVGLoader.prototype = Object.assign( Object.create( THREE.Loader.prototype
var numbers = parseFloats( data );

for ( var j = 0, jl = numbers.length; j < jl; j += 7 ) {

// skip command if start point == end point
if( numbers[ j + 5 ] == point.x && numbers[ j + 6 ] == point.y ) continue;
Copy link
Contributor Author

@gregzanch gregzanch Nov 8, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

as per yomboprime's suggestion


var start = point.clone();
point.x = numbers[ j + 5 ];
Expand Down Expand Up @@ -576,6 +579,9 @@ THREE.SVGLoader.prototype = Object.assign( Object.create( THREE.Loader.prototype

for ( var j = 0, jl = numbers.length; j < jl; j += 7 ) {

// skip command if no displacement
if( numbers[ j + 5 ] == 0 && numbers[ j + 6 ] == 0 ) continue;

var start = point.clone();
point.x += numbers[ j + 5 ];
point.y += numbers[ j + 6 ];
Expand Down Expand Up @@ -660,6 +666,12 @@ THREE.SVGLoader.prototype = Object.assign( Object.create( THREE.Loader.prototype

function parseArcCommand( path, rx, ry, x_axis_rotation, large_arc_flag, sweep_flag, start, end ) {

if( rx == 0 || ry == 0 ) {
// draw a line if either of the radii == 0
path.lineTo( end.x, end.y );
return;
}

Copy link
Contributor Author

@gregzanch gregzanch Nov 8, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As per yomboprime's suggestion

x_axis_rotation = x_axis_rotation * Math.PI / 180;

// Ensure radii are positive
Expand Down
12 changes: 12 additions & 0 deletions examples/jsm/loaders/SVGLoader.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -398,6 +398,9 @@ SVGLoader.prototype = Object.assign( Object.create( Loader.prototype ), {
var numbers = parseFloats( data );

for ( var j = 0, jl = numbers.length; j < jl; j += 7 ) {

// skip command if start point == end point
if( numbers[ j + 5 ] == point.x && numbers[ j + 6 ] == point.y ) continue;

var start = point.clone();
point.x = numbers[ j + 5 ];
Expand Down Expand Up @@ -588,6 +591,9 @@ SVGLoader.prototype = Object.assign( Object.create( Loader.prototype ), {

for ( var j = 0, jl = numbers.length; j < jl; j += 7 ) {

// skip command if no displacement
if( numbers[ j + 5 ] == 0 && numbers[ j + 6 ] == 0 ) continue;

var start = point.clone();
point.x += numbers[ j + 5 ];
point.y += numbers[ j + 6 ];
Expand Down Expand Up @@ -672,6 +678,12 @@ SVGLoader.prototype = Object.assign( Object.create( Loader.prototype ), {

function parseArcCommand( path, rx, ry, x_axis_rotation, large_arc_flag, sweep_flag, start, end ) {

if( rx == 0 || ry == 0 ) {
// draw a line if either of the radii == 0
path.lineTo( end.x, end.y );
return;
}

x_axis_rotation = x_axis_rotation * Math.PI / 180;

// Ensure radii are positive
Expand Down
8 changes: 8 additions & 0 deletions examples/models/svg/zero-radius.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions examples/webgl_loader_svg.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,8 +104,8 @@
"Defs": 'models/svg/tests/testDefs/Svg-defs.svg',
"Defs2": 'models/svg/tests/testDefs/Svg-defs2.svg',
"Defs3": 'models/svg/tests/testDefs/Wave-defs.svg',
"Defs4": 'models/svg/tests/testDefs/defs4.svg'

"Defs4": 'models/svg/tests/testDefs/defs4.svg',
"Zero Radius": 'models/svg/zero-radius.svg'

} ).name( 'SVG File' ).onChange( update );

Expand Down