Chart.js 额外的未定义列答案

【问题标题】：Chart.js extra undefined columnChart.js 额外的未定义列
【发布时间】：2016-01-13 20:57:10
【问题描述】：

我从https://codeload.github.com/nnnick/Chart.js/zip/master 下载了chart.js 的示例和条形图的修改示例，执行代码后，条形图中会生成一个额外的列。这是chart.js 中的错误吗？还是代码有问题？如果是 chart.js 问题，请建议我绘制条形图的任何其他替代方法。谢谢

<!doctype html>
<html>
    <head>
        <title>Bar Chart</title>
        <script src="../Chart.js"></script>
    </head>
    <body>
        <div style="width: 50%">
            <canvas id="canvas" height="450" width="600"></canvas>
        </div>


    <script>
    var randomScalingFactor = function(){ return Math.round(Math.random()*100)};

    var barChartData = {
        labels : ["January","February","March","April","May","Jun"],
        datasets : [
            {
                fillColor : "rgba(220,220,220,0.5)",
                strokeColor : "rgba(220,220,220,0.8)",
                highlightFill: "rgba(220,220,220,0.75)",
                highlightStroke: "rgba(220,220,220,1)",
                data : [randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor()]
            },
            {
                fillColor : "rgba(151,187,205,0.5)",
                strokeColor : "rgba(151,187,205,0.8)",
                highlightFill : "rgba(151,187,205,0.75)",
                highlightStroke : "rgba(151,187,205,1)",
                data : [randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor(),randomScalingFactor()]
            },
            {
                fillColor: "rgba(220,220,220,0.5)",
                strokeColor: "rgba(220,220,220,0.8)",
                highlightFill: "rgba(220,220,220,0.75)",
                highlightStroke: "rgba(220,220,220,1)",
                data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()]
            }
        ]

    }
    window.onload = function(){
        var ctx = document.getElementById("canvas").getContext("2d");
        window.myBar = new Chart(ctx).Bar(barChartData, {
            responsive : true
        });
    }

    </script>
    </body>
</html>

【问题讨论】：

标签： javascript html charts bar-chart chart.js

【解决方案1】：

每个数据集中都有一个额外的点（标签中的 7 个而不是 6 个）。只需从 3 个数据集中删除最后一个点即可。

【讨论】：