ai-research-survey

commit 8378a8226cb32ffa456ceaab94abc9b42ccb619b
parent 40085bd948ffe671e0449b2f1e9da4ba121b01d5
Author: Brian Graham <brian@buildingbetterteams.de>
Date:   Mon, 23 Mar 2026 11:17:48 +0100

Add jitter to two cultures scatter to show density

Scores are quantized (4 artifacts questions = 0/25/50/75/100%) so
dots stack on grid intersections. Added deterministic jitter using
golden-angle distribution so overlapping dots spread into visible
clusters while maintaining approximate position.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Diffstat:
M
explorer/src/views/findings.ts
 | 
15
++++++++++++---

1 file changed, 12 insertions(+), 3 deletions(-)
diff --git a/explorer/src/views/findings.ts b/explorer/src/views/findings.ts
@@ -598,10 +598,19 @@ function renderTwoCultures(f: Findings): string {
   const xScale = (v: number) => pad.l + (v / 100) * cw;
   const yScale = (v: number) => pad.t + ch - (v / 100) * ch;
 
+  // Deterministic jitter to spread overlapping dots on the quantized grid
+  function jitter(idx: number, axis: number): number {
+    // Simple hash-like spread: use index to distribute dots in a circle around the grid point
+    const angle = ((idx * 137.5 + axis * 73) % 360) * Math.PI / 180;
+    const radius = 6 + (idx * 3.7 % 5);
+    return Math.cos(angle) * radius;
+  }
+
   let dots = '';
-  for (const p of papers) {
-    const cx = xScale(p.artifacts);
-    const cy = yScale(p.human_studies);
+  for (let i = 0; i < papers.length; i++) {
+    const p = papers[i];
+    const cx = xScale(p.artifacts) + jitter(i, 0);
+    const cy = yScale(p.human_studies) + jitter(i, 1);
     const color = p.score < 40 ? '#f06565' : p.score < 55 ? '#f0c050' : '#3dd68c';
     dots += `<circle cx="${cx}" cy="${cy}" r="5" fill="${color}" opacity="0.6">
       <title>${p.id}: artifacts ${p.artifacts}%, human_studies ${p.human_studies}%, score ${p.score}%</title>