Fiddling with display

web/stat.html

@@ -10,8 +10,10 @@ html, body {
     margin: 0;
 }
 #pie canvas {
-    max-width: 50px;
+    max-width: 20vw;
+    max-height: 20vh;
     position: absolute;
+    opacity: 90%;
 }
 #area canvas {
     width: 100vw;

web/stat.mjs

@@ -108,7 +108,7 @@ class PieChart extends Chart{
 
             this.ctx.fillStyle = this.colors[i]
             this.ctx.beginPath()
-            this.ctx.arc(0, 0, this.r, θ, θ + angle, false)
+            this.ctx.arc(0, 0, this.r, θ, θ + angle)
             this.ctx.lineTo(0, 0)
             this.ctx.fill()
 
@@ -126,6 +126,13 @@ class PieChart extends Chart{
             }
             θ += angle
         }
+        // Put a border around it
+        this.ctx.strokeStyle = "silver"
+        this.ctx.lineWidth = 5
+        this.ctx.beginPath()
+        this.ctx.arc(0, 0, this.r - this.ctx.lineWidth/2, 0, τ)
+        this.ctx.stroke()
+
         this.ctx.restore()
     }
 }