Chart.js：最后一栏缺少样式和工具提示

Question

由于某种原因，最后一列获得了last-1样式，并且一旦鼠标悬停在其上，就会丢失工具提示：

var ctx = document.getElementById('canvas').getContext('2d');
var myChart = new Chart(ctx, {
      type: 'bar',
      data: {
        labels: ["Poor", "Fair", "Good", "Very Good", "Excellent", "N/A", "Total", "Average"],
        datasets: [{
          data: [1, 1, 1, 5, 4, 0, 12, 9.2],
          label: 'Issue with Average column',
          backgroundColor: [
                    'rgba(255, 0, 0, 0.3)',
                    'rgba(255, 255, 0, 0.3)',
                    'rgba(0, 0, 255, 0.3)',
                    'rgba(0, 255, 255, 0.3)',
                    'rgba(135,206,235, 0.3)',
                    'rgba(128,128,128, 0.3)',
                    'rgba(255,215,0, 0.3)',
                    'rgba (0, 104, 139, 0.3)'
                  ],
          borderColor: [
                    'rgba(255, 0, 0, 0.6)',
                    'rgba(255, 255, 0, 0.6)',
                    'rgba(0,0, 255, 0.6)',
                    'rgba(0, 255, 255, 0.6)',
                    'rgba(135,206,235, 0.6)',
                    'rgba(128,128,128, 0.6)',
                    'rgba(255,215,0, 0.6)',
                    'rgba (0, 104, 139, 0.6)'
                ],
          borderWidth: 1
     }]}});

以下是屏幕截图：

这里是jsfiddle的链接。

我将很高兴知道它为什么会发生以及如何击败它...谢谢！

Answer 1

只需更改'rgba（0，104，139，0.3）' 到'rgba（0，104，139，0.3）' 因为它是一个字符串，您不能使用空格