Buenas tardes a todos. Estoy tratando de usar gráficos en la misma página. Está funcionando, pero sigo recibiendo un error en el registro de mi consola:
Uncaught Error: Canvas is already in use. Chart with ID '1' must be destroyed before the canvas with ID 'rankingsActive' can be reused.mi html
<div> <canvas id="rankings" ></canvas> </div> <div> <canvas id="rankingsActive"></canvas> </div>Mi código javascript. Publicaré la primera función que crea mi primer gráfico. Tengo una función similar con la única diferencia de la última línea. Nombre de gráfico diferente y orientación a mi segunda identificación de lienzo
function rankingTypes(ranks) { //const labels = ["January", "February", "March", "April", "May", "June"] const data = { labels: Object.keys(ranks), datasets: [ { label: "My First dataset", backgroundColor: "rgb(255, 99, 132)", borderColor: "rgb(255, 99, 132)", data: Object.values(ranks), }, ], } console.log(data) console.log(Object.values(ranks)) const config = { type: "pie", data: data, } const rankChart = new Chart(document.getElementById("rankings"), config) }Esto significa que ya hizo un gráfico en ese lienzo, por lo que debe destruirlo primero. Esto se puede hacer así:
const c = Chart.getChart(canvasId); if (c) c.destroy(); new Chart(canvasId, config);