feat(react-components): Add ground plane rotation 0.52.0

[greenbech]

Type of change

Jira ticket 📘

No JIRA ticket.

Description 📝

This PR makes the ground plane load the Euler rotation and scale from DM. Before it only loaded the position.

How has this been tested? 🔍

This has been tested by yalc-ing with fusion.

Test instructions ℹ️

Currently, I don't think there is any other easy way of testing than yalc-ing this into fusion and see that the rotation is the same as in SceneBuilder.

Checklist ☑️

• I am proud of this feature.
• I have performed a self-review of my own code.
• I have added PR type (Feat, Bug, Chore, Test, Docs, Style, Refactor) to the PR title.
• I have manually tested this for different scenarios (different models, formats, devices, browsers).
• I have commented my code in hard-to-understand areas.
• I have made corresponding changes to the public documentation.
• I have added unit and visuals tests to prove that my feature works to the best of my ability.
• I have refactored the code for readability to the best of my ability.
• I have checked that my changes do not introduce regressions in the public documentation.
• I have outlined any known defects / lacking capabilities in the contents of this PR.
• I have listed any remaining work that should follow this PR in the description or jira/miro/etc.
• I have added TSDoc to any public facing changes.
• I have added "developer documentation" in any package README.md that is related / applicable to this PR.
• I have noted down and am currently tracking any technical debt introduced in this PR.
• I have thoroughly thought about the architecture of this implementation.
• I have asked peers to test this feature.

[pramodcog]

Cant we just convert Euler rotation to quaternion and apply to the mesh?

[greenbech]

We should also apply the scale. Isn't this what I'm doing? I am open to changing the syntax — do you have a concrete suggestion?

[pramodcog]

   // Apply position from groundPlane
    mesh.position.set(groundPlane.position.x, groundPlane.position.y, groundPlane.position.z);

    // Convert Euler rotation to quaternion and apply to the mesh
    const euler = new Euler(groundPlane.rotation.x, groundPlane.rotation.y, groundPlane.rotation.z, groundPlane.rotation.order ?? 'XYZ');
    mesh.quaternion.setFromEuler(euler);

    // Apply scaling from groundPlane
    mesh.scale.set(groundPlane.scaleX, groundPlane.scaleY, groundPlane.scaleZ);

I feel this is much simpler, unless it causes an issue

[pramodcog]

I think below is much better than above suggestion

    // Apply position, rotation, and scale using matrix
    const matrix = new Matrix4();
    const position = new Vector3(groundPlane.position.x, groundPlane.position.y, groundPlane.position.z);
    const rotation = new Euler(groundPlane.rotation.x, groundPlane.rotation.y, groundPlane.rotation.z, groundPlane.rotation.order ?? 'XYZ');
    const scale = new Vector3(groundPlane.scaleX, groundPlane.scaleY, groundPlane.scaleZ);

    matrix.compose(position, new Quaternion().setFromEuler(rotation), scale);
    mesh.matrix.copy(matrix);
    matrix.decompose(mesh.position, mesh.quaternion, mesh.scale);

[greenbech]

After chatting with @haakonflatval-cognite, I think maybe the simplest way of doing this is what I updated it to now:

      mesh.matrix.copy(matrix4);
      mesh.matrixAutoUpdate = false;

Do you agree?

[pramodcog]

👍

[haakonflatval-cognite]

LGTM 👍

[anders-hopland]

LGTM