feat: Add point labels to small world comparison scatter plot

freenet · Nov 27, 2024 · 13f84fd · 13f84fd
1 parent f3c8e56
commit 13f84fd
Showing 1 changed file with 15 additions and 3 deletions.
diff --git a/hugo-site/static/js/small-world-comparison.js b/hugo-site/static/js/small-world-comparison.js
@@ -343,18 +343,30 @@ waitForD3().then(() => {
             { x: rnAvgPath, y: rnSuccess }
         ];
 
-        // Add points without legend
-        svg.selectAll('.point')
+        // Add points with labels
+        const pointGroups = svg.selectAll('.point-group')
             .data(data)
             .enter()
-            .append('circle')
+            .append('g')
+            .attr('class', 'point-group');
+
+        // Add circles
+        pointGroups.append('circle')
             .attr('class', 'point')
             .attr('cx', d => x(d.x))
             .attr('cy', d => y(d.y))
             .attr('r', 6)
             .attr('fill', (d, i) => i === 0 ? '#4292c6' : '#08519c')
             .style('opacity', 0.80);
 
+        // Add labels
+        pointGroups.append('text')
+            .attr('x', d => x(d.x) + 10)
+            .attr('y', d => y(d.y) + 5)
+            .text((d, i) => i === 0 ? 'Small World' : 'Random')
+            .attr('font-size', '12px')
+            .attr('fill', (d, i) => i === 0 ? '#4292c6' : '#08519c');
+
 
     }