custom voxel mesh builder

object visibility

webclient/src/components/DebugLabel.tsx

@@ -6,6 +6,7 @@ import type { RuntimeObjectInstance } from "../types";
 import { debugLabelsStore } from "../state/debugLabelsStore";
 import { state } from "../state";
 import { observer } from "mobx-react-lite";
+import { formatV3 } from "../utils";
 
 export const DebugLabel = observer(function ({ obj }: { obj: RuntimeObjectInstance; }) {
     const groupRef = useRef<THREE.Group>(null);
@@ -13,8 +14,8 @@ export const DebugLabel = observer(function ({ obj }: { obj: RuntimeObjectInstan
     const rb = obj.rb();
     const texts = [
         `${state.world.getObjectTypeById(obj.typeId)?.name} ${obj.id}`,
-        `position: ${obj.position}`,
-        `rotation: ${obj.rotation}`,
+        `position: ${formatV3(obj.position)}`,
+        `rotation: ${formatV3(obj.rotation)}`,
         ...Object.entries(debugLabelsStore.getAll(obj.id))
             .map(([k, v]) => `${k}: ${v}`),
     ];
@@ -51,13 +52,14 @@ export const DebugLabel = observer(function ({ obj }: { obj: RuntimeObjectInstan
                 <div style={{
                     background: 'rgba(0,0,0,0.65)',
                     color: '#fff',
-                    padding: '2px 7px',
-                    borderRadius: 4,
-                    fontSize: 12,
+                    padding: 10,
+                    borderRadius: 10,
+                    fontSize: 10,
                     fontFamily: 'monospace',
                     whiteSpace: 'pre',
                     pointerEvents: 'none',
                     userSelect: 'none',
+                    opacity: 0.3,
                 }}>
                     {text}
                 </div>