Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Object3D.attach: Rotated child inside non-uniformly scaled parent causes issues

See original GitHub issue

Describe the bug

In certain circumstances, when using Object3D.attach, there is a visible difference in the child object before and after the method has been called. From what I can tell, this is an issue when:

The parent object has been scaled in a non-uniform way (e.g. only on the X axis)
The child object has been rotated

To Reproduce

Steps to reproduce the behavior:

Go to https://codesandbox.io/s/vibrant-brahmagupta-i0nlv?file=/src/index.js:0-956
Click on the page to attach the cube to scene (starts in a group)
The box changes appearance

Code / Example https://codesandbox.io/s/vibrant-brahmagupta-i0nlv?file=/src/index.js:0-956

Expected behavior

The box shouldn’t have any visible differences after being attached to the scene

Platform:

Device: Desktop
OS: MacOS
Browser: Chrome
Three.js version: r134

Issue Analytics

State:
Created 2 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

1reaction

WestLangleycommented, Nov 10, 2021

@funwithtriangles Attaching a child to a non-uniformly-scaled parent should work if you set matrixAutoUpdate to false for the child.

cube.updateMatrix();
cube.matrixAutoUpdate = false;

1reaction

Mugen87commented, Nov 3, 2021

The engine does not fully support non-uniform scale. At least not this particular use case, see https://github.com/mrdoob/three.js/issues/15079#issuecomment-431232639.

This limitation is known and noted in the Matrix4 doc page.

Top Results From Across the Web

Non-uniform scale causes rotation and deformation issues ...

Causes : Non-uniform scaling at the OBJECT level can skew or distort associated child objects in 3ds Max, and produce unacceptable results when ......

rotated child object looking at Camera, using lookaAt() and ...

lookAt() does not support objects with rotated and/or translated parent(s). There may be a work-around. Do any of your objects have non-uniform scale...

rotationGizmo the rotation results abnormally when the parent node ...

After the parent node is scaled, unexpected deviation occurs in the rotation of the child node, resulting in abnormal scaling and rotation.

Object3D#attach – three.js docs

Rotates the object to face a point in world space. This method does not support objects having non-uniformly-scaled parent(s). # .raycast ( raycaster...

Transformations, Coordinate Systems, and the Scene Graph

Here, we explore how to move objects around in 3D space using translation, rotation, and scale, and the coordinate systems which makes up...