javascript - Chart.js 图例配置选项不起作用

Question

我已经使用chart.js 有一段时间了，我正在尝试观看视频以重新了解如何创建图表。我被困在他定位传奇的部分。

由于某种原因，图例配置不起作用。即使我添加display: false,它也不会从原来的位置移动。我一直在寻找我的代码中的错误，看看我是否只是输入了错误，但我似乎找不到任何东西，谁能帮我解决这个问题？

这是我的代码：

    <div class="container">
        <canvas id="myChart"></canvas>
    </div>

    <script>
        let myChart = document.getElementById('myChart').getContext('2d');
        let colorHex = ['#C0392B', '#884EA0', '#3498DB', '#138D75', '#F4D03F', '#34495E'];
        let labels = ['Boston', 'Worcester', 'Springfield', 'Lowell', 'Cambridge', 'New Bedfort']
        let percentages = [617594, 181045, 153060, 106519, 105162, 95072]

        let massPopChart = new Chart(myChart, {
            type:'pie', // bar, horizontalBar, pie, line, doughnut, radar, polarArea
            data:{
                labels: labels,
                datasets:[{
                    label: 'Skills',
                    data: percentages,
                    backgroundColor: colorHex,
                    hoverBorderWidth: 2,
                    hoverBorderColor: colorHex

                }]
            },
            options:{
              title: {
                display: true,
                text: 'Largest cities',
                fontSize: '25'
                },
                legend: {
                    display: false,
                     position:'bottom'
                }
            }
        });
    </script>
</body>

标签： javascriptchart.js