Estoy usando Vue Chart.js para crear gráficos en mis proyectos. Traté de ocultar la leyenda, pero parece que no reconoce mi comando display:false. Traté de usar el ejemplo que ofrecieron en su repositorio de github. Los datos del gráfico se cargan correctamente. ¿Estoy haciendo algo mal? (Yo uso Vue 2).
<template> <Bar :chart-options="chartOptions" :chart-data="chartData" :width="width" :height="height" /> </template> <script> import {Bar} from 'vue-chartjs/legacy' import {Chart as ChartJS, Title, Tooltip, Legend, BarElement, CategoryScale, LinearScale} from 'chart.js' ChartJS.register(Title, Tooltip, Legend, BarElement, CategoryScale, LinearScale) export default { name: 'MyBarChart', components: {Bar}, props: { chartId: { type: String, default: 'bar-chart' }, datasetIdKey: { type: String, default: 'label' }, width: { type: Number, default: 400 }, height: { type: Number, default: 200 }, chartData:{ type: Object, default: () => { } } }, data() { return { chartOptions: { responsive: true, legend: { display: false } } } }, } </script>legend es un complemento para gráficos, por lo que estará debajo de los plugins en las opciones.
options: { plugins: { legend: { display: false } } }