@andespindola/brainlink 0.1.0-beta.108 → 0.1.0-beta.109

package/README.md

@@ -603,6 +603,7 @@ The graph UI shows:
 - adaptive CPU safeguards for large graphs: idle frame pacing, throttled background physics updates and cached viewport dimensions to reduce redraw/layout overhead while preserving interaction responsiveness
 - hierarchical hot-path optimizations reduce per-frame allocations and repeated scans during layered cluster expansion and edge projection
 - hierarchical edge projection now caches hub membership and node-to-cluster resolution per frame to keep large recursive subgraph rendering smooth during continuous zoom and pan
+- hierarchical projection now uses stronger perspective yaw/pitch and depth-based render ordering so layered subgraphs read as a true 3D field instead of a flat expansion
 - WebGL node and edge acceleration when supported, falling back to Canvas 2D without changing graph behavior
 - compact macro-to-micro density progression so reset keeps the graph mass oriented and zoom-in separates local neighborhoods progressively
 - graph camera treats hub-centered navigation as structural only when the hub is dominant; diffuse stress graphs reset and zoom around the full graph mass

package/dist/application/frontend/client-js.js

@@ -35,6 +35,10 @@ const ecosystemDepthNear = 80
 const ecosystemDepthFar = 2600
 const ecosystemDepthPerspective = 620
 const ecosystemDepthTiltY = 0.24
+const ecosystemDepthYaw = 0.22
+const ecosystemDepthPitch = 0.16
+const ecosystemDepthRadialGain = 0.09
+const ecosystemDepthOrbitalMaxOffset = 160
 const ecosystemDepthMinScale = 0.24
 const ecosystemDepthOpacityFloor = 0.2
 const zoomRecoveryGuardMs = 4200
@@ -1207,12 +1211,23 @@ const ecosystemDepthForCluster = (cluster, levelIndexMap) => {
 
 const projectEcosystemPoint = (x, y, depth, anchor) => {
   const safeDepth = Math.max(0, depth)
-  const factor = ecosystemDepthPerspective / (ecosystemDepthPerspective + safeDepth)
-  const verticalTilt = safeDepth * ecosystemDepthTiltY
+  const dx = x - anchor.x
+  const dy = y - anchor.y
+  const yawSin = Math.sin(ecosystemDepthYaw)
+  const yawCos = Math.cos(ecosystemDepthYaw)
+  const pitchSin = Math.sin(ecosystemDepthPitch)
+  const pitchCos = Math.cos(ecosystemDepthPitch)
+  const rotatedX = dx * yawCos + safeDepth * yawSin
+  const rotatedZ = Math.max(0, safeDepth * yawCos - dx * yawSin)
+  const rotatedY = dy * pitchCos - rotatedZ * pitchSin
+  const projectedDepth = Math.max(0, rotatedZ + Math.max(0, dy * pitchSin))
+  const factor = ecosystemDepthPerspective / (ecosystemDepthPerspective + projectedDepth)
+  const verticalTilt = projectedDepth * ecosystemDepthTiltY
   return {
-    x: anchor.x + (x - anchor.x) * factor,
-    y: anchor.y + (y - anchor.y) * factor - verticalTilt,
-    factor
+    x: anchor.x + rotatedX * factor,
+    y: anchor.y + rotatedY * factor - verticalTilt,
+    factor,
+    projectedDepth
   }
 }
 
@@ -1223,7 +1238,13 @@ const applyEcosystemDepthProjection = (clusters, edges, anchor) => {
 
   for (let index = 0; index < clusters.length; index += 1) {
     const cluster = clusters[index]
-    const depth = ecosystemDepthForCluster(cluster, levelIndexMap)
+    const baseDepth = ecosystemDepthForCluster(cluster, levelIndexMap)
+    const radialDistance = Math.hypot(cluster.x - anchor.x, cluster.y - anchor.y)
+    const radialOffset = cluster.isHub ? 0 : Math.min(320, radialDistance * ecosystemDepthRadialGain)
+    const orbitalOffset = cluster.isHub
+      ? 0
+      : Math.sin(Math.atan2(cluster.y - anchor.y, cluster.x - anchor.x) * 2.2) * ecosystemDepthOrbitalMaxOffset
+    const depth = Math.max(0, baseDepth + radialOffset + orbitalOffset)
     const projected = projectEcosystemPoint(cluster.x, cluster.y, depth, anchor)
     const baseOpacity = Number.isFinite(cluster.lodOpacity) ? cluster.lodOpacity : 1
     const depthScale = ecosystemDepthMinScale + (1 - ecosystemDepthMinScale) * projected.factor
@@ -1236,7 +1257,7 @@ const applyEcosystemDepthProjection = (clusters, edges, anchor) => {
       x: projected.x,
       y: projected.y,
       lodOpacity: baseOpacity * depthOpacity,
-      depth,
+      depth: projected.projectedDepth,
       depthScale
     }
     projectedClusters.push(projectedCluster)
@@ -2981,6 +3002,9 @@ const clusterRadiusPx = cluster => {
 const clusterOpacity = cluster =>
   Math.max(0, Math.min(1, Number.isFinite(cluster.lodOpacity) ? cluster.lodOpacity : 1))
 
+const clusterDepth = cluster => Number.isFinite(cluster.depth) ? cluster.depth : ecosystemDepthNear
+const clusterDepthScale = cluster => Number.isFinite(cluster.depthScale) ? cluster.depthScale : 1
+
 const worldViewportBounds = () => {
   const width = Math.max(state.viewport.width, 320)
   const height = Math.max(state.viewport.height, 320)
@@ -3400,6 +3424,8 @@ const render = now => {
     ctx.save()
     ctx.translate(state.transform.x, state.transform.y)
     ctx.scale(state.transform.scale, state.transform.scale)
+    const orderedClusters = [...state.renderClusters]
+      .sort((left, right) => clusterDepth(right) - clusterDepth(left))
     const safeScale = Math.max(state.transform.scale, 0.0001)
     if (state.renderClusterEdges.length > 0) {
       for (let index = 0; index < state.renderClusterEdges.length; index += 1) {
@@ -3408,15 +3434,17 @@ const render = now => {
         if (edgeOpacity <= 0.01) {
           continue
         }
+        const depthScale = Math.min(clusterDepthScale(edge.sourceCluster), clusterDepthScale(edge.targetCluster))
+        const widthScale = 0.6 + depthScale * 0.9
         ctx.beginPath()
         ctx.moveTo(edge.sourceCluster.x, edge.sourceCluster.y)
         ctx.lineTo(edge.targetCluster.x, edge.targetCluster.y)
-        ctx.lineWidth = 1.2 / safeScale
+        ctx.lineWidth = (1.2 * widthScale) / safeScale
         ctx.strokeStyle = 'rgba(153, 165, 181, ' + (edge.inferred ? 0.14 : 0.22) * edgeOpacity + ')'
         ctx.stroke()
       }
     }
-    state.renderClusters.forEach(cluster => {
+    orderedClusters.forEach(cluster => {
       const isMacro = cluster.id === 'macro-galaxy'
       const isEcosystem = String(cluster.id).startsWith('ecosystem-')
       const isHub = Boolean(cluster.isHub)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@andespindola/brainlink",
-  "version": "0.1.0-beta.108",
+  "version": "0.1.0-beta.109",
   "description": "Local-first knowledge memory for agents with Markdown, backlinks, indexing and context retrieval.",
   "type": "module",
   "license": "MIT",