modificar el tamaño de una gráfica chartjs de tipo 'doughnut' in javascript

Para modificar el tamaño de una gráfica Chart.js de tipo 'doughnut' en JavaScript, puedes hacer uso de la propiedad maintainAspectRatio en la configuración de la gráfica.

Aquí te dejo un ejemplo de cómo modificar el tamaño de una gráfica Chart.js de tipo doughnut:

index.tsx
// Obtienes la referencia al elemento canvas en el DOM
var chartCanvas = document.getElementById('myChart');

// Configuración de la gráfica
var chartConfig = {
    type: 'doughnut', // Tipo de gráfica
    data: {
        //...
    },
    options: {
        //...
        maintainAspectRatio: false, // Desactiva el tamaño por defecto
    }
};

// Crea la instancia de Chart.js
var chart = new Chart(chartCanvas, chartConfig);

// Modifica el tamaño de la gráfica
chart.canvas.parentNode.style.height = '300px';
chart.canvas.parentNode.style.width = '300px';
559 chars
22 lines

En este ejemplo, se desactiva el tamaño por defecto de Chart.js con la propiedad maintainAspectRatio: false en la configuración de la gráfica. Luego, se modifica el tamaño del contenedor que envuelve a la gráfica mediante CSS para establecer un ancho y alto de 300px.

related categories

gistlibby LogSnag