如何通过canvas进行简单的图像识别

发布网友 发布时间：2022-04-21 19:27

我来回答

共1个回答

热心网友 时间：2022-04-14 22:01

1、获取canvas调用
var c = document.createElement('canvas');
context = c.getContext('2d');

2、获取导入图像信息
var hiddenImage = new Image();
hiddenImage.src=图片地址
context .drawImage(hiddenImage, 0, 0, width, height);
hiddenImage .onload=function(){
context.putImageData(hiddenImage, 0, 0);
}

3、获取图片的像素信息
var imageData = context.getImageData(0, 0, w, h);
//注意这个获取的是数组，注意每1个像素由数组的4个元素组成，四个元素分别代码四个通道r/g/b/a的值
for(var j=0;j<hiddenImage.height;j+=1){
for(var i=0;i<hiddenImage.width;i+=1){
//注意这里获取图片信息后可以进行定制化处理
offset=4*(hiddenImage.width*j+i);
var red = sourceImageData[offset];
var green = sourceImageData[offset + 1];
var blue = sourceImageData[offset + 2];
var brightness = getBrightness(red,green,b