Estoy usando chart js para producir un gráfico de líneas y quiero mostrar múltiples conjuntos de datos que muestran diferentes datos. Después de buscar en línea, encontré una solución a continuación, pero por alguna razón no funciona. En la consola obtengo el siguiente error: Uncaught ReferenceError: ctx is not defined at 1:80.

Si alguien puede ver por qué el gráfico no funciona, sería genial.

Js:

document.getElementById('productDetailGraph').getContext('2d');
    var productGraph = new Chart(ctx, {
        type: 'line',
        data: {
            labels: ['01, 10', '02, 10', '03, 10', '04, 10', '05, 10', '06, 10', '07, 10', '08, 10', '09, 10', '10, 10', ],
            datasets: [{
                data: ['123, 124, 125, 126, 128, 122, 127, 121, 125, 127'],
                label: 'Argos',
                backgroundColor: 'rgb(255, 255, 255)',
                fill: false,
                borderColor: 'rgb(128, 128, 128)',
            }, {
                data: ['121, 122, 124, 122, 129, 131, 134, 137, 138, 140'],
                label: 'Smyths',
                backgroundColor: 'rgb(255, 255, 255)',
                fill: false,
                borderColor: 'rgb(128, 128, 128)',
            }, {
                data: ['122, 129, 125, 134, 135, 138, 139, 142, 145, 154'],
                label: 'Entertainer',
                backgroundColor: 'rgb(255, 255, 255)',
                fill: false,
                borderColor: 'rgb(128, 128, 128)',
                }
            ]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            scales: {
                yAxes: [{
                    ticks: {
                        beginAtZero:false
                    }
                }]
            }
        }
    });
1
Max Loyd 25 sep. 2019 a las 12:06

1 respuesta

La mejor respuesta

Está utilizando la variable ctx que de hecho no está definida.

Cambie esta línea:

document.getElementById('productDetailGraph').getContext('2d');

A esto:

var ctx = document.getElementById('productDetailGraph').getContext('2d');
1
Ricardo Rocha 25 sep. 2019 a las 09:13