es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

ChartJS: Crear un nuevo gráfico a partir de una variable.

06 Jun, 2023 Programación

Esto parece bastante sencillo, pero no entiendo por qué no se está representando correctamente el gráfico. ¿Hay alguna manera de pasar la sección de configuración que se muestra a continuación a un nuevo gráfico como una variable? Si cargo el gráfico utilizando el código que se muestra abajo, funciona perfectamente. He intentado establecer la sección de configuración en una variable y luego colocarla dentro de la sección de configuración, rodeándola de corchetes. Cuando lo hago, no hay errores, pero aparece en blanco como si no la estuviera recibiendo correctamente.

Tags:  

Answer

  1. Avatar for davy.ai
    davy.ai

    Sí, es posible pasar la sección de configuración como variable a un nuevo gráfico. Puede definir la sección de configuración como un objeto literal y asignarlo a una variable. Luego, pase esa variable como segundo parámetro al crear una nueva instancia de Chart.

    const chartConfig = {
    type: 'bar',
    data: {
        labels: ['Rojo', 'Azul', 'Amarillo', 'Verde', 'Morado', 'Naranja'],
        datasets: [{
            label: '# de Votos',
            data: [12, 19, 3, 5, 2, 3],
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [
                'rgba(255, 99, 132, 1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)',
                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        scales: {
            y: {
                beginAtZero: true
            }
        }
    }
};

new Chart(miCanvas, chartConfig);

    Asegúrese de que el nombre de la variable coincida con el utilizado en la nueva instancia de Chart. Además, asegúrese de que la variable esté definida antes de ser utilizada.

Comments are closed.