Add a scatter plot graph of the blame.yml data to the blame.md file

aider/website/_includes/blame.md

@@ -0,0 +1,60 @@
+<canvas id="blameChart" width="800" height="450" style="margin-top: 20px"></canvas>
+<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+<script>
+document.addEventListener('DOMContentLoaded', function () {
+    var ctx = document.getElementById('blameChart').getContext('2d');
+    var blameData = {
+        datasets: [{
+            label: 'Aider Percentage',
+            data: [
+                {% for row in site.data.blame %}
+                {
+                    x: '{{ row.end_date }}',
+                    y: {{ row.aider_percentage }},
+                    label: '{{ row.end_tag }}'
+                },
+                {% endfor %}
+            ],
+            backgroundColor: 'rgba(54, 162, 235, 0.2)',
+            borderColor: 'rgba(54, 162, 235, 1)',
+            borderWidth: 1
+        }]
+    };
+
+    var blameChart = new Chart(ctx, {
+        type: 'scatter',
+        data: blameData,
+        options: {
+            scales: {
+                x: {
+                    type: 'time',
+                    time: {
+                        unit: 'day'
+                    },
+                    title: {
+                        display: true,
+                        text: 'Date'
+                    }
+                },
+                y: {
+                    title: {
+                        display: true,
+                        text: 'Aider Percentage'
+                    },
+                    beginAtZero: true,
+                    max: 100
+                }
+            },
+            plugins: {
+                tooltip: {
+                    callbacks: {
+                        label: function(context) {
+                            return `${context.raw.label}: ${context.raw.y.toFixed(2)}%`;
+                        }
+                    }
+                }
+            }
+        }
+    });
+});
+</script>