是否有使用 html5/js 将任何图像转换为 2d 矩阵的解决方案 例子
picture.jpg -------be Converted to -----> matrice[W][H] of pixels
最佳答案
正如其他人所指出的,您可以使用 Canvas 元素来完成此操作。我会发布一个 JSFiddle,除了这种技术只适用于托管在与页面相同的域上的图像(除非图像是 cross-origin enabled )......而且 JSFiddle 似乎没有托管任何合适的图像以在示例中使用。所以这是我用来测试这个的代码:
// Get a reference to the image you want the pixels of and its dimensions
var myImage = document.getElementById('theImageToWorkWith');
var w = myImage.width, h = myImage.height;
// Create a Canvas element
var canvas = document.createElement('canvas');
// Size the canvas to the element
canvas.width = w;
canvas.height = h;
// Draw image onto the canvas
var ctx = canvas.getContext('2d');
ctx.drawImage(myImage, 0, 0);
// Finally, get the image data
// ('data' is an array of RGBA pixel values for each pixel)
var data = ctx.getImageData(0, 0, w, h);
继续阅读 canvas pixel manipulation了解详情。 您可能还想验证 canvas tag is supported在您关心的浏览器上。
关于javascript - 如何使用 JavaScript/HTML5 获取二维图像矩阵,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14910520/