He usado chart.js una vez hace un tiempo y estoy tratando de seguir un video para volver a cómo crear un gráfico. Me quedé atascado en la parte donde está colocando la leyenda.

Por alguna razón, la configuración de la leyenda no funciona. Incluso cuando agrego display: false, no se mueve de su posición original. He estado buscando un error en mi código para ver si escribí algo mal, pero parece que no puedo encontrar nada, ¿alguien puede ayudarme con esto?

Aquí está mi código:

 <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>