Oops

Update puzzle radar chart.js like it is in lichess, test later
ddugovic · Jan 13, 2024 · 70ca75b · 70ca75b
1 parent 3dd8ae9
commit 70ca75b
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 19 deletions.
diff --git a/modules/fishnet/src/test/VariationValidationTest.scala b/modules/fishnet/src/test/VariationValidationTest.scala
@@ -14,7 +14,7 @@ final class VariationValidationTest extends Specification {
 
   private def evenIncomplete(result: Reader.Result): Replay =
     result match {
-      case Reader.Result.Complete(_, replay)   => replay
+      case Reader.Result.Complete(replay)   => replay
       case Reader.Result.Incomplete(replay, _) => replay
     }
 

diff --git a/ui/puzzle/package.json b/ui/puzzle/package.json
@@ -13,7 +13,7 @@
   "license": "AGPL-3.0-or-later",
   "devDependencies": {
     "@build/rollupProject": "2.0.0",
-    "@types/chart.js": "^2.9.29",
+    "@types/chart.js": "^4.4",
     "@types/lishogi": "2.0.0",
     "rollup": "^2",
     "typescript": "^5"

diff --git a/ui/puzzle/src/dashboard.ts b/ui/puzzle/src/dashboard.ts
@@ -20,25 +20,30 @@ export function renderRadar(data: any) {
     type: 'radar',
     data: d,
     options: {
-      legend: {
-        display: false,
-      },
-      scale: {
-        ticks: {
+      aspectRatio: 2,
+      scales: {
+        r: {
           beginAtZero: false,
           suggestedMin: Math.min(...d.datasets[0].data) - 100,
-          fontColor,
-          showLabelBackdrop: false, // hide square behind text
-        },
-        pointLabels: {
-          fontSize: 16,
-          fontColor,
-        },
-        gridLines: {
-          color: lineColor,
-        },
-        angleLines: {
-          color: lineColor,
+          ticks: {
+            color: fontColor,
+            showLabelBackdrop: false, // hide square behind text
+            format: {
+              useGrouping: false,
+            },
+          },
+          pointLabels: {
+            color: fontColor,
+            font: {
+              size: window.innerWidth < 500 ? 11 : 16,
+            },
+          },
+          grid: {
+            color: lineColor,
+          },
+          angleLines: {
+            color: lineColor,
+          },
         },
       },
     },