How JavaScript sets the background of a canvas picture to white or transparent
Editor to share with you how JavaScript sets the background of canvas pictures to white or transparent, I believe most people don't know much about it, so share this article for your reference. I hope you can learn a lot after reading this article. Let's learn about it together.
Canvas picture background is set to white or transparent
Var canvas = document.getElementById ("canvas"); var imageData = canvas.getContext ("2d"). GetImageData (0,0, canvas.width, canvas.height); for (var I = 0; I < imageData.data.length; I + = 4) {/ / when the pixel is transparent, it is set to white if (imageData.data [I + 3] = 0) {imageData.data [I] = 255; imageData.data [I + 1] = 255 ImageData.data [I + 2] = 255; imageData.data [I + 3] = 255;}} canvas.getContext ("2d") .putImageData (imageData, 0,0); var img = canvas.toDataURL ("image/jpeg"); img = img.substring (img.indexOf (',') + 1); for (var I = 0; I < imageData.data.length) I + = 4) {/ / when the pixel is white, set to transparent if (imageData.data [I] = = 255) {imageData.data [I] = 0; imageData.data [I + 1] = 0; imageData.data [I + 2] = 0; imageData.data [I + 3] = 0;}} canvas.getContext ("2d") .putImageData (imageData, 0,0) The above is all the content of the article "how JavaScript sets the background of canvas pictures to white or transparent". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!