<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>图像识别</title>
<script src="../js/jquery.js"></script>
</head>
<body>
<canvas id="canvas" style="display: none;"></canvas>
<script>
function rgb(objs, fn) {
var obj = objs.obj || objs,
obj = obj || null,
fn = fn || new Function(),
_thisCanvas = document.createElement('canvas'),
canvas = _thisCanvas,
ctx = canvas.getContext('2d'),
img = null,
CY_index = objs.index || 100;//默认抽样数据未100；
if (obj == null) {
return new Error("参数不能为空");
} else {
switch (typeof obj) {
case "object":
img = obj;
break;
case "string":
img = new Image();
img.src = obj;
break;
};
};
img.onload = function (e) {
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
var w = objs.w || img.width,
h = objs.h || img.height;
var rgb = [];
var xy = [];
if(objs.xy){
for(var i = 0 ; i < objs.xy.length ; i++){//抽样数据匹配
var xs = objs.xy[i].x;
var ys = objs.xy[i].y;
xy.push({
x:xs,
y:ys
});
var imgData = ctx.getImageData(xs, ys, w, h).data;
imgData.forEach(function (e,i) {
rgb.push(e);
});
};
}else{
for(var i = 0 ; i < CY_index;i++){//CY_index：随机抽样100个像素点
var xs = parseInt(Math.random()*(img.width/2)+(img.width/4));
var ys = parseInt(Math.random()*(img.height/2)+(img.height/4));
xy.push({
x:xs,
y:ys
});
var imgData = ctx.getImageData(xs, ys, w, h).data;
imgData.forEach(function (e,i) {
rgb.push(e);
});
};
};
var index = 0,
key = 0,
bool = true,
newrgb = [];
rgb.forEach(function (i, e) {
if (bool) {
newrgb[key] = new Array();
bool = false;
};
newrgb[key].push(i);
if (index == 3) {
index = -1;
key++;
bool = true;
};
index++;
});
fn(newrgb,xy);
};
};
rgb.init = function (obj,fn) {
var _this = this;
obj = obj || {};
fn = fn || new Function();
obj.index = obj.index || 100;//默认抽样数据个数
obj.w = obj.w || 1;//像素大小
obj.h = obj.h || 1;//像素大小
_this({obj:obj.obj,w:obj.w,h:obj.h,index:obj.index
},function (e,xy) {
var data = e;
var V = obj.v || 80;//默认匹配率80
obj.objData.forEach(function (ed,ei) {
_this({obj:ed,w:obj.w,h:obj.h,xy:xy,index:obj.index},function (E) {
var dataB = E;
var index = 0;
data.forEach(function (A,i) {
if(A[0] == dataB[i][0] && A[1] == dataB[i][1] && A[2] == dataB[i][2]){
index ++;
};
});
retData = {};//回调数据
if(index >= V){//匹配率比较
retData.meg = "匹配成功.";
retData.obj = ed;
retData.code = 200;
}else{
retData.meg = "匹配失败.";
retData.code = 500;
}
fn(retData);
});
});
obj.fn = obj.fn || new Function();//匹配结束回调
obj.fn();
});
}
var imgData = [
"img/1.jpg",
"img/1-1.jpg",
"img/2.jpg",
"img/2-1.jpg",
"img/3.jpg",
"img/3-1.jpg",
"img/4.jpg",
"img/4-1.jpg",
"img/5.jpg",
"img/5-1.jpg",
"img/6.jpg",
"img/6-1.jpg",
"img/7.jpg",
"img/7-1.jpg",
"img/8.jpg",
"img/8-1.jpg",
"img/8-2.jpg",
"img/8-3.jpg",
"img/8-4.jpg",
"img/8-5.jpg",
"img/8-6.jpg",
"img/8-7.jpg",
"img/8-8.jpg",
"img/9.jpg",
"img/9-1.jpg",
"img/10.jpg",
"img/11.jpg",
];
rgb.init({
obj:"img/8.jpg",//需匹配对象，必填
objData:imgData,//查询数据，必填
w:1,//像素大小，可选
h:1,//像素大小，可选
v:100,//匹配率，可选
index:100,//匹配抽样，可选
fn:function () {//匹配完成回调，可选
//.....
}
},function (e) {//匹配回调
if(e.code == 200){
console.log(e.obj);
$("body").append('<img src="'+e.obj+'"/>');
};
});
</script>
</body>
</html>
web图片识别
转载于:https://www.cnblogs.com/zys8119/p/5882435.html
相关文章：
通俗易懂，到底什么是区块链？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 2017年9月4日，中国政府正式明令禁止ICO和数字货币交易行为，随即关闭了多个数字货币交易所。同时政府也多次声明࿰…
select三级联动 怎么删除前一个的_python测试开发django57.xadmin选项二级联动
前言当我们选择项目分类的时候，一个项目下关联多个模块，同时有这两个选项框的时候，需要实现选中一个项目，模块里面自动删除出该项目下的模块，如下图这种解决基本思路：1.写个jqeury脚本监听change事件2.ajax…
安装wdcp的方法和bug
1.Wdcp安装SSH登录系统,这里讲解源码编译安装和RPM包安装两种 a.源码编译安装 下载源码包wget http://dl.wdlinux.cn:5180/lanmp_laster.tar.gz 解压并安装 tar zxvf lanmp_laster.tar.gz sh in.sh linux安装wdcp之后mysql找不到my.cnf，locate my-medium.cnf。 cp /…
第七周读书笔记
《深入理解计算机系统》从程序设计与性能优化的角度介绍了计算机系统，让我从程序员的角度了解了计算机系统，更深入地理解了硬件、操作系统和编译系统等对应用程序性能和正确性的影响，并掌握了基本的程序优化设计技术，为编写更高效…
是什么限制了区块链技术的应用？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 2017年已经匆匆离去，回顾过去一整年，似乎区块链应用一直处于隐忍未发的状态，很多项目的落地已处于验证阶段&…
软件包管理（rpmyum）
一、rpm包管理器 rpm是一个功能强大的包管理工具，可用于构建，安装，查询，验证，更新和卸载软件包。 用法： rpm [OPTION...] 配置文件： /var/lib/rpm/ 已安装rpm包的元数据 选项： -i&am…
python yield理解_对Python中Yield的理解
看到下面这段程序的时候，有点不明白这个yield到底是个啥东西，看了网上很多的博客，大致理解了yield的含义，所以记录下来。要说yield首先要说python中的生成器，那么什么是生成器?假设有一个包含一百万个元素的列表&…
Linux下文件的三种时间戳
Linux下文件的三种时间标记 三种时间对应关系表 columncolumncolumn访问时间Accessatime修改时间Modifymtime状态改动时间Changectime如何查看文件文件的三种时间戳 stat filename 三种时间戳的解释 访问时间：读一次文件的内容，这个时间就会更新。比如mo…
比特币和以太坊本质有什么区别？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 14年的时候，币圈 （当时还没有链圈之说，链圈应该是17年的事情了，区块链概念的流行是15年底…
HDU1402（FFT入门）
题目链接：http://acm.hdu.edu.cn/status.php?userReykjavik11207&pid1402&status5 本题数据范围为5e4，常规方法O(n2)肯定是不行的。 FFT是离散傅里叶变换DFT的快速形式 对多项式f(x) a0 a1x a2x2 an-1xn-1，有两种表示法&#x…
python怎么读_如何用Python读写文件
前面我们已经介绍了很多Python相关的基础知识，大家是不是对Python已经有了进一步认识了呢？作为人工智能时代的热门编程语言，开始接触并学习Python的孩子越来越多，家长们都不想让自己的孩子落于人后，近期前来找陈老师咨…
什么是区块链智能合约？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 自从2009年第一枚比特币诞生，九年多时间里，区块链技术正在被应用在人们生活的各方各面，从1.0时代的数字货币&…
python数据分析基础 余本国_Python数据分析基础
本书根据作者多年教学经验编写, 条理清楚, 内容深浅适中, 尽量让读者从实例出发, 结合课后练习, 少走弯路。本书涉及的内容主要包括Python数据类型与运算、流程控制及函数与类、Pandas库的数据处理与分析等。作者通过近三轮的教学，对Python3.x的基础知识进行了筛选和…
stm32F042 (二) 按键触发中断
已经实现GPIO口输出高低电平控制LED，这里实现按键触发中断来改变LED闪亮的频率，因为PB3连着LED，所以PB3的输出模式没有改变，随意选一个GPIO口PA7接按键产生中断。因为nucleo开发板是裸板，所以按键、上拉电阻是另找在面…
区块链和智能合约的关系
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 尽管比特币（Bitcoin）和以太坊（Ethereum）是经常被一起提及的两个词，但实际上࿰…
repo同步代码_iTOP-4412开发板android4.0代码下载和编译
Android4.0 源码可以从光盘，网盘获取稳定版本，也可以从 GitHub 下载我们的开发版本。GitHub 仅提供源码下载，不提供二进制下载，二进制文件存放在光盘和网盘中。基于迅为4412开发板6.3.1.1 repo 下载android 代码管理不同于 uboot,…
vue项目构建实战基础知识：SPA理解/RESTful接口介绍/static目录配置/axios封装/打包时map文件去除...
一、SPA 不是指水疗。是 single page web application 的缩写。中文翻译为 单页应用程序 或 单页Web应用，更多解释请自行搜索。 所有的前端人员都应该明白我们的页面的 url 构成：http://www.fengcms.com/index.html?namefungleo&old32#mylove/is/wo…
神奇的输入 while（cin....）如何在遇见换行之后进入下一层循环读入
1 cin>>m>>n;2 for(int i1;i<m;i){4 int x0;5 char ch ;6 while(ch!10) //在遇到换行之后进入下一层循环读入。7 {8 x;9 cin>>c[x]; 10 chgetchar(); 11 } 神奇的输入。 get skill！转载于:https://www.cnblogs.com/zyker/p/588…
区块链中的“智能合约”有何应用？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 如刺金般闪耀的区块链时代，投资者的热潮还将持续升温，与此同时金融的大佬已经开始注意到区块链应用落地场景的实现ÿ…
米勒罗宾素性测试（Miller–Rabin primality test）
1 #include<iostream> //该程序为哥德巴赫猜（想输出所有的组合）2 #include<cmath>3 #include<cstdlib>4 #include<ctime>5 #include<cstdio>6 7 using namespace std;8 9 typedef unsigned long long ull; 10 typedef u…
Linux Linux程序练习十一（网络编程大文件发送UDP版）
//网络编程发送端--大文件传输（UDP） #include <stdio.h> #include <stdlib.h> #include <string.h> #include <unistd.h> #include <errno.h>#include <sys/types.h> #include <sys/socket.h> #include <n…
iic通信原理_电子知识之IIC通信原理和协议分享
IIC 的一些特征： 两条总线：串行数据总线(SDA)和串行时钟总线(SCL)真正的多主机总线连接到相同总线的ic数量只受到总线的最大电容400pF限制。串行8位双向数据在标准模式下可达100K bit/s快速模式400K bit/s,高速模式下3.4Mbit/s.数据有效性规定࿱…
以太坊核心概念
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 以太坊虚拟机（EVM） 以太坊虚拟机（EVM）是以太坊中智能合约的运行环境。它不仅被沙箱封装起来&#…
使用rest_framework写api接口的一些注意事项(axios发送ajax请求)
1. 类继承GenericAPIView，定义queryset 印象深刻的事：由于原来对于继承关系不太清楚，写接口 APIView/泛指GenericAPIView不太关注queryset没有设置渲染器：默认 [JSONRenderer,BrowsableAPIRenderer]BrowsableAPIRendererÿ…
iir数字滤波器_手把手教系列之一阶数字滤波器设计实现（附代码)
[导读] 前面分享了 IIR/FIR/mean/梳状数字滤波器的具体设计实现，这几种使用起来或许觉得计算量大，相对复杂。实际工程应用中通常有必要过滤来自传感器或音频流的数据，以抑制不必要的噪声。有的应用场景，可能只需要一个最简单的一阶…
正则表达式中$1,$2 ===算是什么意思
$1,$2...是表示的小括号里的内容 $1是第一个小括号里的 ,$2是第2个小括号里的 比如 /gai([\w]?)over([\d])/ 匹配 gainover123 $1 括号里的 n $2 第2个括号里的 123转载于:https://www.cnblogs.com/vertko/p/5888902.html
为什么以太坊能成为区块链2.0的代表之作？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 区块链的学习进入到第四天，前三天学习比特币，分别从比特币的前世、货币属性和背后的区块链技术学习。 比特币是区块链的1…
(转)搭建企业内部yum仓库(centos6+centos7+epel源)
搭建企业内部yum仓库(centos6centos7epel源) 原文：https://www.cnblogs.com/nulige/p/6081192.html https://www.linuxidc.com/Linux/2017-11/148723.htm---------部署yum仓库与定制rpm包 1. 创建yum仓库目录mkdir -p /data/yum_data/cd /data/yum_data/#可以上传rp…
vs按f5没反应_《死神vs火影》中最受欢迎的游戏角色，仙鸣当之无愧上榜
hello！大家好，又到了一日一度的杨某讲游戏环节啦，赶紧系好安全带，准备上车吧。《死神vs火影》作为一款深受广大群众欢迎的街机游戏，自然而然地涌现出了一系列知名游戏角色。那么，大多数人心目中最喜欢&…
IEC61850笔记--IEC61850应用入门（二）
IEC61850标准学习和调试，测试的记录文档，主要参考了IEC61850标准文档，《IEC61850应用入门(第二版)》，开源代码libIEC61850及libIEC61850说明文档。 IEC61850标准内容参考IEC61850标准文档，以及IEC61850标准介绍文档《I…