diff --git a/app/src/modules/builder/aisle/Instances/aisleInstances.tsx b/app/src/modules/builder/aisle/Instances/aisleInstances.tsx
index 1d26157..c72afb1 100644
--- a/app/src/modules/builder/aisle/Instances/aisleInstances.tsx
+++ b/app/src/modules/builder/aisle/Instances/aisleInstances.tsx
@@ -3,6 +3,8 @@ import { useAisleStore } from '../../../../store/builder/useAisleStore';
import { useToggleView } from '../../../../store/builder/store';
import AisleInstance from './instance/aisleInstance';
import Point from '../../point/point';
+import { Html } from '@react-three/drei';
+import { Vector3 } from 'three';
function AisleInstances() {
const { aisles } = useAisleStore();
@@ -39,9 +41,36 @@ function AisleInstances() {
}
- {aisles.map((aisle) =>
-
- )}
+ {aisles.map((aisle) => {
+ const textPosition = new Vector3().addVectors(new Vector3(...aisle.points[0].position), new Vector3(...aisle.points[1].position)).divideScalar(2);
+ const distance = new Vector3(...aisle.points[0].position).distanceTo(new Vector3(...aisle.points[1].position));
+
+ return (
+ <>
+
+
+
+ {distance.toFixed(2)} m
+
+
+
+ )
+ })}
)
diff --git a/app/src/modules/builder/aisle/aisleCreator/referenceAisle.tsx b/app/src/modules/builder/aisle/aisleCreator/referenceAisle.tsx
index 3479ea2..f874dfa 100644
--- a/app/src/modules/builder/aisle/aisleCreator/referenceAisle.tsx
+++ b/app/src/modules/builder/aisle/aisleCreator/referenceAisle.tsx
@@ -3,7 +3,7 @@ import * as THREE from 'three';
import { useFrame, useThree } from '@react-three/fiber';
import { useActiveLayer, useToolMode, useToggleView } from '../../../../store/builder/store';
import * as Constants from '../../../../types/world/worldConstants';
-import { Extrude } from '@react-three/drei';
+import { Extrude, Html } from '@react-three/drei';
import { useBuilderStore } from '../../../../store/builder/useBuilderStore';
import { useDirectionalSnapping } from '../../point/helpers/useDirectionalSnapping';
import { usePointSnapping } from '../../point/helpers/usePointSnapping';
@@ -172,9 +172,39 @@ function ReferenceAisle({ tempPoints }: Readonly) {
}
};
+ const textPosition = new THREE.Vector3().addVectors(new THREE.Vector3(...tempAisle.points[0].position), new THREE.Vector3(...tempAisle.points[1].position)).divideScalar(2);
+ const distance = new THREE.Vector3(...tempAisle.points[0].position).distanceTo(new THREE.Vector3(...tempAisle.points[1].position));
+
+
+ const rendertext = () => {
+ return (
+
+
+ {distance.toFixed(2)} m
+
+
+ )
+ }
+
return (
{renderAisle()}
+ {rendertext()}
);
}
diff --git a/app/src/modules/builder/geomentries/lines/distanceText/distanceText.tsx b/app/src/modules/builder/geomentries/lines/distanceText/distanceText.tsx
index 58302f7..479d820 100644
--- a/app/src/modules/builder/geomentries/lines/distanceText/distanceText.tsx
+++ b/app/src/modules/builder/geomentries/lines/distanceText/distanceText.tsx
@@ -31,10 +31,6 @@ const DistanceText = () => {
const [linesState, setLinesState] = useState([]);
const { roomsState, setRoomsState } = useRoomsState();
-
-
-
-
useEffect(() => {
if (linesState.length === 0) return;
@@ -67,8 +63,6 @@ const DistanceText = () => {
}
-
-
// return Math.abs(area) / 2;
// Build polygon and compute area