Skip to content

WIP allowing rotating ortho views #8595

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

Closed
wants to merge 5 commits into from
Closed

WIP allowing rotating ortho views #8595

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
ec64752
WIP allowing rotating ortho views
MichaelBuessemeyer May 2, 2025
88561b9
allow plane td plane indicator and crosshairs to position arbitrarily
MichaelBuessemeyer May 2, 2025
b5caa85
WIP: rotate cameras
MichaelBuessemeyer May 5, 2025
79d1104
fix rendering
MichaelBuessemeyer May 5, 2025
d94c340
WIP: fix cameras
MichaelBuessemeyer May 5, 2025
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
37 changes: 29 additions & 8 deletions frontend/javascripts/oxalis/controller/scene_controller.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,13 @@ THREE.Mesh.prototype.raycast = acceleratedRaycast;
const CUBE_COLOR = 0x999999;
const LAYER_CUBE_COLOR = 0xffff99;

export const OrthoBaseRotations = {
[OrthoViews.PLANE_XY]: new THREE.Euler(0, Math.PI, 0),
[OrthoViews.PLANE_YZ]: new THREE.Euler(Math.PI, (1 / 2) * Math.PI, 0),
[OrthoViews.PLANE_XZ]: new THREE.Euler((-1 / 2) * Math.PI, 0, 0),
[OrthoViews.TDView]: new THREE.Euler(Math.PI / 4, Math.PI / 4, Math.PI / 4),
};

const getVisibleSegmentationLayerNames = reuseInstanceOnEquality((storeState: OxalisState) =>
getVisibleSegmentationLayers(storeState).map((l) => l.name),
);
Expand Down Expand Up @@ -243,9 +250,9 @@ class SceneController {
[OrthoViews.PLANE_YZ]: new Plane(OrthoViews.PLANE_YZ),
[OrthoViews.PLANE_XZ]: new Plane(OrthoViews.PLANE_XZ),
};
this.planes[OrthoViews.PLANE_XY].setRotation(new THREE.Euler(Math.PI, 0, 0));
this.planes[OrthoViews.PLANE_YZ].setRotation(new THREE.Euler(Math.PI, (1 / 2) * Math.PI, 0));
this.planes[OrthoViews.PLANE_XZ].setRotation(new THREE.Euler((-1 / 2) * Math.PI, 0, 0));
this.planes[OrthoViews.PLANE_XY].setBaseRotation(OrthoBaseRotations[OrthoViews.PLANE_XY]);
this.planes[OrthoViews.PLANE_YZ].setBaseRotation(OrthoBaseRotations[OrthoViews.PLANE_YZ]);
this.planes[OrthoViews.PLANE_XZ].setBaseRotation(OrthoBaseRotations[OrthoViews.PLANE_XZ]);

const planeMeshes = _.values(this.planes).flatMap((plane) => plane.getMeshes());
this.rootNode = new THREE.Group().add(
Expand Down Expand Up @@ -386,13 +393,17 @@ class SceneController {
this.planes[planeId].setOriginalCrosshairColor();
this.planes[planeId].setVisible(!hidePlanes);

const pos = _.clone(originalPosition);

const ind = Dimensions.getIndices(planeId);
// Offset the plane so the user can see the skeletonTracing behind the plane
pos[ind[2]] +=
const positionOffset: [number, number, number] = [0, 0, 0];
positionOffset[ind[2]] +=
planeId === OrthoViews.PLANE_XY ? this.planeShift[ind[2]] : -this.planeShift[ind[2]];
this.planes[planeId].setPosition(pos, originalPosition);
//TODOM: adjust rotation of the plane

this.planes[planeId].offsetForRenderingOrthoView(
new THREE.Vector3(...positionOffset),
originalPosition,
);

this.quickSelectGeometry.adaptVisibilityForRendering(originalPosition, ind[2]);
} else {
Expand All @@ -402,12 +413,21 @@ class SceneController {
}
} else {
for (const planeId of OrthoViewValuesWithoutTDView) {
this.planes[planeId].setPosition(originalPosition);
// this.planes[planeId].setPosition(originalPosition);
this.planes[planeId].setGrayCrosshairColor();
this.planes[planeId].setVisible(
tdViewDisplayPlanes !== TDViewDisplayModeEnum.NONE,
this.isPlaneVisible[planeId] && tdViewDisplayPlanes === TDViewDisplayModeEnum.DATA,
);
const ind = Dimensions.getIndices(planeId);
// Offset the plane so the user can see the skeletonTracing behind the plane
const positionOffset: [number, number, number] = [0, 0, 0];
positionOffset[ind[2]] +=
planeId === OrthoViews.PLANE_XY ? this.planeShift[ind[2]] : -this.planeShift[ind[2]];
this.planes[planeId].dontOffsetForRenderingTDView(
new THREE.Vector3(...positionOffset),
originalPosition,
);
this.planes[planeId].materialFactory.uniforms.is3DViewBeingRendered.value = true;
}
}
Expand All @@ -426,6 +446,7 @@ class SceneController {
);
}

// TODO: maybe this needs to be removed!!!
if (!optArbitraryPlane) {
for (const currentPlane of _.values<Plane>(this.planes)) {
const [scaleX, scaleY] = getPlaneScalingFactor(state, flycam, currentPlane.planeID);
Expand Down
15 changes: 11 additions & 4 deletions frontend/javascripts/oxalis/geometries/arbitrary_plane.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import _ from "lodash";
import constants, { OrthoViews } from "oxalis/constants";
import constants, { OrthoView, OrthoViews } from "oxalis/constants";
import getSceneController from "oxalis/controller/scene_controller_provider";
import PlaneMaterialFactory from "oxalis/geometries/materials/plane_material_factory";
import { getZoomedMatrix } from "oxalis/model/accessors/flycam_accessor";
Expand Down Expand Up @@ -27,12 +27,15 @@ type ArbitraryMeshes = {
class ArbitraryPlane {
meshes: ArbitraryMeshes;
isDirty: boolean;
planeID: OrthoView;
stopStoreListening: () => void;
// @ts-expect-error ts-migrate(2564) FIXME: Property 'materialFactory' has no initializer and ... Remove this comment to see the full error message
materialFactory: PlaneMaterialFactory;
baseRotation: THREE.Euler = new THREE.Euler(0, 0, 0);

constructor() {
constructor(planeID: OrthoView) {
this.isDirty = true;
this.planeID = planeID;
this.meshes = this.createMeshes();
this.stopStoreListening = Store.subscribe(() => {
this.isDirty = true;
Expand All @@ -43,6 +46,9 @@ class ArbitraryPlane {
this.stopStoreListening();
this.materialFactory.stopListening();
}
setBaseRotation = (rotation: THREE.Euler) => {
this.baseRotation = rotation;
};

setPosition = (x: number, y: number, z: number) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'setGlobalPosition' does not exist on typ... Remove this comment to see the full error message
Expand All @@ -66,6 +72,7 @@ class ArbitraryPlane {
return;
}

// TODOM: This needs to be done to the plane view planes as well
const meshMatrix = new THREE.Matrix4();
meshMatrix.set(
matrix[0],
Expand All @@ -87,7 +94,7 @@ class ArbitraryPlane {
);
mesh.matrix.identity();
mesh.matrix.multiply(meshMatrix);
mesh.matrix.multiply(new THREE.Matrix4().makeRotationY(Math.PI));
mesh.matrix.multiply(new THREE.Matrix4().makeRotationFromEuler(this.baseRotation));
mesh.matrixWorldNeedsUpdate = true;
};

Expand All @@ -106,7 +113,7 @@ class ArbitraryPlane {
return _plane;
};

this.materialFactory = new PlaneMaterialFactory(OrthoViews.PLANE_XY, false, 4);
this.materialFactory = new PlaneMaterialFactory(this.planeID, false, 4);
const textureMaterial = this.materialFactory.setup().getMaterial();
const mainPlane = adaptPlane(
new THREE.Mesh(
Expand Down
Loading
Loading