From bb0082b981c5dcf6cff69cc994089d7c6e038063 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Henrik=20Gr=C3=B8nbech?= Date: Mon, 24 Jun 2024 16:00:21 +0200 Subject: [PATCH 1/6] feat: Add ground plane rotation --- .../src/hooks/useGroundPlaneFromScene.tsx | 11 +++---- .../utilities/transformation3dToMatrix4.ts | 30 +++++++++++++++++++ 2 files changed, 34 insertions(+), 7 deletions(-) create mode 100644 react-components/src/utilities/transformation3dToMatrix4.ts diff --git a/react-components/src/hooks/useGroundPlaneFromScene.tsx b/react-components/src/hooks/useGroundPlaneFromScene.tsx index fbf6650efd8..4ccb1098220 100644 --- a/react-components/src/hooks/useGroundPlaneFromScene.tsx +++ b/react-components/src/hooks/useGroundPlaneFromScene.tsx @@ -18,6 +18,7 @@ import { useSDK } from '../components/RevealCanvas/SDKProvider'; import { CDF_TO_VIEWER_TRANSFORMATION, CustomObject } from '@cognite/reveal'; import { useReveal } from '../components/RevealCanvas/ViewerContext'; import { clear } from '../architecture/base/utilities/extensions/arrayExtensions'; +import { transformation3dToMatrix4 } from '../utilities/transformation3dToMatrix4'; export const useGroundPlaneFromScene = (sceneExternalId: string, sceneSpaceId: string): void => { const { data: scene } = useSceneConfig(sceneExternalId, sceneSpaceId); @@ -88,14 +89,10 @@ export const useGroundPlaneFromScene = (sceneExternalId: string, sceneSpaceId: s geometry.name = `CogniteGroundPlane`; const mesh = new Mesh(geometry, material); - mesh.position.set( - groundPlane.translationX, - groundPlane.translationY, - groundPlane.translationZ - ); - mesh.rotation.set(-Math.PI / 2, 0, 0); - mesh.position.applyMatrix4(CDF_TO_VIEWER_TRANSFORMATION); + const matrix4 = transformation3dToMatrix4(groundPlane).multiply(CDF_TO_VIEWER_TRANSFORMATION); + mesh.matrix.copy(matrix4); + matrix4.decompose(mesh.position, mesh.quaternion, mesh.scale); const customObject = new CustomObject(mesh); customObject.isPartOfBoundingBox = false; diff --git a/react-components/src/utilities/transformation3dToMatrix4.ts b/react-components/src/utilities/transformation3dToMatrix4.ts new file mode 100644 index 00000000000..7e3533cbb1f --- /dev/null +++ b/react-components/src/utilities/transformation3dToMatrix4.ts @@ -0,0 +1,30 @@ +/*! + * Copyright 2024 Cognite AS + */ + +import { Euler, MathUtils, Matrix4 } from 'three'; +import { type Transformation3d } from '../hooks/types'; + +export const transformation3dToMatrix4 = ({ + translationX, + translationY, + translationZ, + eulerRotationX, + eulerRotationY, + eulerRotationZ, + scaleX, + scaleY, + scaleZ +}: Transformation3d): Matrix4 => { + return new Matrix4() + .makeTranslation(translationX, translationY, translationZ) + .makeRotationFromEuler( + new Euler( + MathUtils.degToRad(eulerRotationX), + MathUtils.degToRad(eulerRotationY), + MathUtils.degToRad(eulerRotationZ), + 'XYZ' + ) + ) + .makeScale(scaleX, scaleY, scaleZ); +}; From 8e52db939736fc6ed40efcffa1abab4d46328e7a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Henrik=20Gr=C3=B8nbech?= Date: Tue, 25 Jun 2024 11:23:36 +0200 Subject: [PATCH 2/6] chore: Simplify setting matrix --- react-components/src/hooks/useGroundPlaneFromScene.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/react-components/src/hooks/useGroundPlaneFromScene.tsx b/react-components/src/hooks/useGroundPlaneFromScene.tsx index 4ccb1098220..0cd80336ba3 100644 --- a/react-components/src/hooks/useGroundPlaneFromScene.tsx +++ b/react-components/src/hooks/useGroundPlaneFromScene.tsx @@ -84,7 +84,7 @@ export const useGroundPlaneFromScene = (sceneExternalId: string, sceneSpaceId: s } const texture = groundPlaneTextures[index]; const material = new MeshBasicMaterial({ map: texture, side: DoubleSide }); - const geometry = new PlaneGeometry(10000 * groundPlane.scaleX, 10000 * groundPlane.scaleY); + const geometry = new PlaneGeometry(10000, 10000); geometry.name = `CogniteGroundPlane`; @@ -92,7 +92,7 @@ export const useGroundPlaneFromScene = (sceneExternalId: string, sceneSpaceId: s const matrix4 = transformation3dToMatrix4(groundPlane).multiply(CDF_TO_VIEWER_TRANSFORMATION); mesh.matrix.copy(matrix4); - matrix4.decompose(mesh.position, mesh.quaternion, mesh.scale); + mesh.matrixAutoUpdate = false; const customObject = new CustomObject(mesh); customObject.isPartOfBoundingBox = false; From 50cef592dd2832d8768cb2cdf5a0f961cc4e828d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Henrik=20Gr=C3=B8nbech?= Date: Tue, 25 Jun 2024 13:07:44 +0200 Subject: [PATCH 3/6] chore: Rework API --- .../utilities/transformation3dToMatrix4.ts | 25 +++++++++++-------- 1 file changed, 14 insertions(+), 11 deletions(-) diff --git a/react-components/src/utilities/transformation3dToMatrix4.ts b/react-components/src/utilities/transformation3dToMatrix4.ts index 7e3533cbb1f..813be0f8972 100644 --- a/react-components/src/utilities/transformation3dToMatrix4.ts +++ b/react-components/src/utilities/transformation3dToMatrix4.ts @@ -2,7 +2,7 @@ * Copyright 2024 Cognite AS */ -import { Euler, MathUtils, Matrix4 } from 'three'; +import { Euler, MathUtils, Matrix4, Quaternion, Vector3 } from 'three'; import { type Transformation3d } from '../hooks/types'; export const transformation3dToMatrix4 = ({ @@ -16,15 +16,18 @@ export const transformation3dToMatrix4 = ({ scaleY, scaleZ }: Transformation3d): Matrix4 => { - return new Matrix4() - .makeTranslation(translationX, translationY, translationZ) - .makeRotationFromEuler( - new Euler( - MathUtils.degToRad(eulerRotationX), - MathUtils.degToRad(eulerRotationY), - MathUtils.degToRad(eulerRotationZ), - 'XYZ' - ) + const quaternion = new Quaternion().setFromEuler( + new Euler( + MathUtils.degToRad(eulerRotationX), + MathUtils.degToRad(eulerRotationY), + MathUtils.degToRad(eulerRotationZ), + 'XYZ' ) - .makeScale(scaleX, scaleY, scaleZ); + ); + + return new Matrix4().compose( + new Vector3(translationX, translationY, translationZ), + quaternion, + new Vector3(scaleX, scaleY, scaleZ) + ); }; From ed2365bf0265e7f4734511fb57f87f46c250282b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Henrik=20Gr=C3=B8nbech?= Date: Tue, 25 Jun 2024 13:43:18 +0200 Subject: [PATCH 4/6] fix: Apply CDF_TO_VIEWER_TRANSFORMATION correctly --- react-components/src/hooks/useGroundPlaneFromScene.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/react-components/src/hooks/useGroundPlaneFromScene.tsx b/react-components/src/hooks/useGroundPlaneFromScene.tsx index 0cd80336ba3..3a70b211dcf 100644 --- a/react-components/src/hooks/useGroundPlaneFromScene.tsx +++ b/react-components/src/hooks/useGroundPlaneFromScene.tsx @@ -90,7 +90,9 @@ export const useGroundPlaneFromScene = (sceneExternalId: string, sceneSpaceId: s const mesh = new Mesh(geometry, material); - const matrix4 = transformation3dToMatrix4(groundPlane).multiply(CDF_TO_VIEWER_TRANSFORMATION); + const matrix4 = transformation3dToMatrix4(groundPlane).premultiply( + CDF_TO_VIEWER_TRANSFORMATION + ); mesh.matrix.copy(matrix4); mesh.matrixAutoUpdate = false; From 1b527f6a29d37ec1cb041b0a7ff21829082ab92c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Henrik=20Gr=C3=B8nbech?= Date: Fri, 28 Jun 2024 13:54:28 +0200 Subject: [PATCH 5/6] bump to 0.51.0 --- react-components/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/react-components/package.json b/react-components/package.json index 3b15d39c271..a698dd6d4f2 100644 --- a/react-components/package.json +++ b/react-components/package.json @@ -1,6 +1,6 @@ { "name": "@cognite/reveal-react-components", - "version": "0.50.0", + "version": "0.51.0", "exports": { ".": { "import": "./dist/index.js", From 6d8a8b1454a6fabc8293b1b047f8ef7bd703697c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Henrik=20Gr=C3=B8nbech?= Date: Fri, 28 Jun 2024 13:56:34 +0200 Subject: [PATCH 6/6] chore: Bump version again to 0.52.0 --- react-components/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/react-components/package.json b/react-components/package.json index e139099319b..4cc0c4105fc 100644 --- a/react-components/package.json +++ b/react-components/package.json @@ -1,6 +1,6 @@ { "name": "@cognite/reveal-react-components", - "version": "0.51.0", + "version": "0.52.0", "exports": { ".": { "import": "./dist/index.js",