Added more debug logging for cylinder rendering

seflless · Sep 21, 2023 · ba0d0ce · ba0d0ce
1 parent bd18416
commit ba0d0ce
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 9 deletions.
diff --git a/src/renderer/renderCylinder.ts b/src/renderer/renderCylinder.ts
@@ -26,7 +26,7 @@ export function renderCylinder(
   worldTransform: Matrix4x4,
   cameraZoom: number,
   cameraDirection: Vector3,
-  _inverseCameraMatrix: Matrix4x4,
+  inverseCameraMatrix: Matrix4x4,
   inverseAndProjectionMatrix: Matrix4x4
 ) {
   const points: Vector3[] = [
@@ -44,8 +44,14 @@ export function renderCylinder(
     );
   });
 
-  const yAxis = Vector3(0, 1, 0);
-  worldTransform.extractBasis(Vector3(0, 0, 0), yAxis, Vector3(0, 0, 0));
+  const yAxisWorldSpace = Vector3(0, 0, 0);
+  worldTransform.extractBasis(
+    Vector3(0, 0, 0),
+    yAxisWorldSpace,
+    Vector3(0, 0, 0)
+  );
+  const yAxisCameraSpace = yAxisWorldSpace.clone();
+  inverseCameraMatrix.applyToVector3(yAxisCameraSpace);
 
   const addCylinderEnd = (
     { x, y }: Vector3,
@@ -82,9 +88,16 @@ export function renderCylinder(
   // Top === -1
   // Front === 0
   // Bottom === 1
-  const dotProduct = yAxis.dotProduct(cameraDirection);
-  console.log(dotProduct);
-  const isTopVisible = yAxis.dotProduct(cameraDirection) > 0;
+  const dotProduct = yAxisWorldSpace.dotProduct(
+    cameraDirection.clone().multiply(-1)
+  );
+  console.log(
+    `dotProduct: ${dotProduct.toFixed(3)} 
+    yAxisCameraSpace: ${yAxisCameraSpace.x.toFixed(
+      2
+    )}, ${yAxisCameraSpace.y.toFixed(2)}, ${yAxisCameraSpace.z.toFixed(2)}`
+  );
+  const isTopVisible = dotProduct > 0;
 
   addCylinderEnd(
     isTopVisible ? points[CylinderEnds.Top] : points[CylinderEnds.Bottom],

diff --git a/workbench/scenes/SingleCylinder.ts b/workbench/scenes/SingleCylinder.ts
@@ -32,12 +32,13 @@ export default function () {
     strokeWidth: 10,
   });
 
-  const position = Vector3(0, referenceRadius / 2, 0);
+  const height = referenceRadius * 4;
+  const position = Vector3(0, height / 2, 0);
   const cylinder = Cylinder({
     id: "reference",
     position,
     radius: referenceRadius,
-    height: referenceRadius * 4,
+    height,
     // radius: referenceRadius,
     fill: Color(255, 0, 0),
     stroke: Color(0, 0, 0),
@@ -133,7 +134,9 @@ export default function () {
 
     // updateCamera(45, 20);
 
-    cylinder.rotation.x = now * 90;
+    // cylinder.rotation.x = now * 90;
+    cylinder.rotation.x = 0;
+    cylinder.rotation.z = 0;
 
     // lightSphere.position.x =
     //   Math.sin(now * Math.PI * 2 * lightSpeed) * lightDistance;