diff --git a/web/stat.html b/web/stat.html index 0ed3e9f..a6e5345 100644 --- a/web/stat.html +++ b/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; diff --git a/web/stat.mjs b/web/stat.mjs index bb4001a..e006447 100644 --- a/web/stat.mjs +++ b/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() } }