@wandelbots/wandelbots-js-react-components 1.46.4 → 1.47.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wandelbots/wandelbots-js-react-components",
-  "version": "1.46.4",
+  "version": "1.47.0",
   "description": "React UI toolkit for building applications on top of the Wandelbots platform",
   "type": "module",
   "sideEffects": false,

package/src/components/3d-viewport/TrajectoryRenderer.tsx

@@ -0,0 +1,40 @@
+import { Line } from "@react-three/drei"
+import type { GetTrajectoryResponse } from "@wandelbots/wandelbots-js"
+import * as THREE from "three"
+
+export type TrajectoryRendererProps = {
+  trajectory: GetTrajectoryResponse
+} & JSX.IntrinsicElements["group"]
+
+export function TrajectoryRenderer({
+  trajectory,
+  ...props
+}: TrajectoryRendererProps) {
+  const points =
+    trajectory.trajectory
+      ?.map((point) => {
+        if (point.tcp_pose) {
+          return new THREE.Vector3(
+            point.tcp_pose.position.x / 1000,
+            point.tcp_pose.position.z / 1000,
+            -point.tcp_pose.position.y / 1000,
+          )
+        }
+        return null
+      })
+      .filter((point): point is THREE.Vector3 => point !== null) || []
+
+  return (
+    <group {...props}>
+      {points.length > 0 && (
+        <Line
+          points={points}
+          lineWidth={3}
+          polygonOffset={true}
+          polygonOffsetFactor={10}
+          polygonOffsetUnits={10}
+        />
+      )}
+    </group>
+  )
+}

package/src/index.ts

@@ -1,5 +1,6 @@
 export * from "./components/3d-viewport/PresetEnvironment"
 export * from "./components/3d-viewport/SafetyZonesRenderer"
+export * from "./components/3d-viewport/TrajectoryRenderer"
 export * from "./components/jogging/JoggingCartesianAxisControl"
 export * from "./components/jogging/JoggingJointRotationControl"
 export * from "./components/jogging/JoggingPanel"