En mi proyecto, las coordenadas X e Y se mueven como una carrera de karts. Para eso, dibujé una pista para ver por qué corrían. Sin embargo, el problema es que al igual que los puntos, este track/ruta cargado se volverá a cargar y desaparecerá, aunque quiero que se quede ahí todo el camino. ¿Alguien podría ayudarme?

 var myChart; let canvas = document.getElementById('myChart'); let ctx = canvas.getContext('2d'); function init(){ myChart = new Chart(ctx, { type: 'scatter', data: { datasets: [{ label:[datas.nameandgokart[0].username+" - "+datas.nameandgokart[0].gokart_name.substring(4,8)], backgroundColor:["red"], data: [], },] }, options: { responsive: false, aspectRatio: 1, maintainAspestRatio: true, scales: { xAxes: [{ gridLines:{ color:"rgba(0,0,0,0)" }, }] , yAxes: [{ gridLines:{ color:"rgba(0,0,0,0)" }, }] } }); const movements = JSON.parse(localStorage.getItem("Palya")); function drawLine(ctx, x1, y1, x2, y2) { ctx.beginPath(); ctx.strokeStyle = 'black'; ctx.lineWidth = 4; ctx.moveTo(x1, y1); ctx.lineTo(x2, y2); ctx.stroke(); ctx.closePath(); } for(const movement of movements){ drawLine(ctx,...movement.from,...movement.to) } } init() }) Here is the drawLine: [1]: https://i.stack.imgur.com/RP80X.png The problem is after starting the go-kart on the chart: [2]: https://i.stack.imgur.com/7Wm4g.png