如何从HTML5画布使用JavaScript检索原始位图数据？

我想知道如何从HTML5画布中提取原始数据作为原始位图像素数据并将其存储在变量中。如何从HTML5画布使用JavaScript检索原始位图数据？

到目前为止，我已经设置我的图像HTML5画布它： https://jsfiddle.net/t21mjh5L/1/

var c = document.getElementById("myCanvas"); 
var ctx = c.getContext("2d"); 
var img = document.getElementById("myimg"); 
ctx.drawImage(img,0,0); 
var bitmapData; 
//retrieve image data as raw bitmap

来源

2016-01-06 user1869257

你见过[这个老问题]（http://stackoverflow.com/questions/667045/getpixel-从HTML的画布）？ – Pointy

你可以尝试得到这样的位图数据：

var myImageData = ctx.getImageData(left, top, width, height).data;

有关获取图像数据

更多信息可以发现 here

来源

2016-01-06 19:00:36 thisisbb

谢谢。你的回答帮助我找到了这篇文章，它帮助我得到了我想要的东西。 https://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays/ – user1869257

此外，如果任何人有兴趣，这是如何获得原始jpeg数据：\t var jpegRawData = canvas .toDataURL（“image/jpeg”，1.0）.replace（“data：image/jpeg; base64，”，“”）; – user1869257

如何从HTML5画布使用JavaScript检索原始位图数据？

回答

相关问题