Tengo imágenes que no puedo mostrar correctamente en mi canvas debido a problemas de transparencia, y en mi intento de solucionarlas me encontré con un nuevo problema.

Cuando uso mi código a continuación, todas mis imágenes se muestran con un fondo negro . No estoy seguro de cómo eliminarlos, después de pasar tiempo investigando. ¡Insight sería útil!

 drawPiece(x, y, space) { ctx.fillRect(x, y, this.squareSize, this.squareSize) if (space != null) { const img = new Image(this.squareSize, this.squareSize) img.src = space.image img.onload = () => { ctx.drawImage(img, x, y, this.squareSize, this.squareSize) let imageData = ctx.getImageData(x, y, this.squareSize, this.squareSize) let data = imageData.data for (let i=0; i<data.length; i+=4) { if (data[i+3] < 255) { data[i] = 255 - data[i]; data[i+1] = 255 - data[i+1]; data[i+2] = 255 - data[i+2]; data[i+3] = 255 - data[i+3]; } } ctx.putImageData(imageData, x, y) } } }