updated navmesh invisible state

app/src/modules/builder/agv/agv.tsx

@@ -12,11 +12,9 @@ interface RawNavMesh {
 interface NavMesh {
   raw: RawNavMesh;
 }
-// interface LineProps{
-//     lines
-//     planes:
-// } 
-export default function Agv({  }) {
+export default function Agv({ lines, plane }: any) {
+  console.log("planes: ", plane);
+  console.log("lines: ", lines);
   const { scene } = useThree();
   const groupRef = useRef<THREE.Group | null>(null);
   const [navMesh, setNavMesh] = useState<RecastNavMesh | null>(null);
@@ -1567,7 +1565,12 @@ export default function Agv({  }) {
 
   return (
     <>
-      <PolygonGenerator groupRef={groupRef} processPoint={processPoint} />
+      <PolygonGenerator
+        groupRef={groupRef}
+        processPoint={processPoint}
+        lines={lines}
+        plane={plane}
+      />
       <NavMeshDetails setNavMesh={setNavMesh} />
       {pathPoints.map((pair, i) => (
         <PathNavigator navMesh={navMesh} pathPoints={pair} key={i} />

app/src/modules/builder/agv/navMeshDetails.tsx

@@ -155,7 +155,7 @@ export default function NavMeshDetails({ setNavMesh }: MeshState) {
         // Draw the debug visualization
         const debugDrawer = new DebugDrawer();
         debugDrawer.drawNavMesh(navMesh);
-        scene.add(debugDrawer); // Uncomment if you want to add the debug drawer to the scene
+        // scene.add(debugDrawer); // Uncomment if you want to add the debug drawer to the scene
       } catch (error) {}
     };
 

app/src/modules/builder/agv/polygonGenerator.tsx

@@ -17,26 +17,34 @@ type LineData = {
 type PolygonGeneratorProps = {
   processPoint: LineData[];
   groupRef: React.RefObject<THREE.Group>;
+  lines: any;
+  plane: any;
 };
 
 export default function PolygonGenerator({
   processPoint,
   groupRef,
+  lines,
+  plane,
 }: PolygonGeneratorProps) {
   const { scene } = useThree();
-  let lines : Types.Lines;
-//   console.log("storedFloorItems: ", lines);
+  console.log(
+    "lines: ",
+    lines.current.map((val: any) => val)
+  );
+  console.log("planes: ", plane);
+  //   console.log("storedFloorItems: ", lines);
 
-//   useEffect(() => {
-//     if (!groupRef?.current) return;
-//     const groundGeometry = new THREE.BoxGeometry(80, 1, 60);
-//     const groundMaterial = new THREE.MeshBasicMaterial({ color: "#99ff99" });
-//     const groundMesh = new THREE.Mesh(groundGeometry, groundMaterial);
-//     groundMesh.position.set(-10, -0.5, 3);
-//     groundMesh.name = "GroundMesh";
-//     groupRef.current.add(groundMesh);
-//     scene.add(groupRef.current);
-//   }, [groupRef, scene]);
+  useEffect(() => {
+    if (!groupRef?.current) return;
+    //   const groundGeometry = new THREE.BoxGeometry(80, 1, 60);
+    //   const groundMaterial = new THREE.MeshBasicMaterial({ color: "#99ff99" });
+    //   const groundMesh = new THREE.Mesh(groundGeometry, groundMaterial);
+    //   groundMesh.position.set(-10, -0.5, 3);
+    //   groundMesh.name = "GroundMesh";
+    groupRef.current.add(plane);
+    scene.add(groupRef.current);
+  }, [groupRef, scene]);
 
   useEffect(() => {
     if (!processPoint) return;
@@ -97,7 +105,10 @@ export default function PolygonGenerator({
     const height = 3;
 
     const geometry = new THREE.BoxGeometry(width, height, depth);
-    const material = new THREE.MeshBasicMaterial({ color: "#ff66cc" });
+    const material = new THREE.MeshBasicMaterial({
+      color: "#ff66cc",
+      visible: false,
+    });
     const mesh = new THREE.Mesh(geometry, material);
     mesh.position.set((minX + maxX) / 2, height / 2, (minZ + maxZ) / 2);
 

app/src/modules/scene/world/world.tsx

@@ -359,8 +359,7 @@ export default function World() {
 
       <DrieHtmlTemp itemsGroup={itemsGroup} />
 
-      <Agv />
-      {/* <Agv lines={lines} plane={plane} /> */}
+      <Agv lines={lines} plane={plane} />
     </>
   );
 }