APP-9-文字识别-车牌识别
1.获取Access Token
2.代码部分
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no" Content-type="application/x-www-form-urlencoded">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" Content-type="application/x-www-form-urlencoded" content="black">
<link rel="stylesheet" href="../../css/mui.min.css">
<title>车牌识别测试</title>
</head> <body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">车牌设别</h1>
</header> <div class="mui-content">
<div class="mui-content-padded">
<h5 class="mui-content-padded">车牌号</h5>
<div class="mui-row">
<input id='cph' type="text" class="mui-text-left mui-btn-block" style="width:85%;float: left;%" placeholder="拍照获取车牌"></input>
<button id="head" type="button" class="mui-icon mui-icon-camera mui-btn-primary" style="width:15%;float: right;background-color: "></button>
</div>
<h5 class="mui-content-padded">详情</h5>
<div class="mui-input-row" style="height: 120px;">
<textarea id="bkrst" class="form" rows="5" placeholder="返回详情"></textarea>
</div>
<div class="mui-content">
<h5 class="mui-content-padded">拍照图片</h5>
<img style="width:100%;height: 20%;" class="mui-media-object mui-pull-left head-img" id="cphpic"></img>
</div>
</div>
</div> <!--//跨域问题：调用JS文件-->
<script src="../../js/tts/baidu_tts_cors.js"></script>
<script src="../../js/mui.min.js"></script>
<script src="../../js/jquery.js"></script>
<script type="text/javascript">
document.getElementById('head').addEventListener('tap', function() {
console.log("start test");
if(mui.os.plus) {
var a = [{
title: "拍照"
}, {
title: "从手机相册选择"
}]; plus.nativeUI.actionSheet({
title: "车牌设别",
cancel: "取消",
buttons: a
}, function(b) { /*actionSheet 按钮点击事件*/
switch(b.index) {
case 0:
break;
case 1:
getImage(); /*拍照*/
break;
case 2:
galleryImg(); /*打开相册*/
break;
default:
break;
}
})
}
}, false);
//拍照
function getImage() {
var cmr = plus.camera.getCamera();
var res = cmr.supportedImageResolutions[0];
var fmt = cmr.supportedImageFormats[0];
cmr.captureImage(function(path) {
//plus.io.resolveLocalFileSystemURL(path, function(entry) {
plus.io.resolveLocalFileSystemURL(path, function(entry) {
var localUrl = entry.toLocalURL();
document.getElementById("cphpic").src = localUrl;
uploadHead(localUrl + "?version=" + new Date().getTime());
}, function(err) {
console.error("拍照失败：" + err.message);
}, {
index: 1
});
});
}
//本地相册选择
function galleryImg() {
plus.gallery.pick(function(a) {
plus.io.resolveLocalFileSystemURL(a, function(entry) {
plus.io.resolveLocalFileSystemURL("_doc/", function(root) {
root.getFile("head.png", {}, function(file) {
//文件已存在
file.remove(function() {
console.log("file remove success");
entry.copyTo(root, 'head.png', function(e) {
var e = e.fullPath + "?version=" + new Date().getTime();
console.log(entry.toLocalURL());
document.getElementById("cphpic").src = entry.toLocalURL();
uploadHead(e); /*上传图片*/
//变更大图预览的src
//目前仅有一张图片，暂时如此处理，后续需要通过标准组件实现
}, function(e) {
console.log('copy image fail:' + e.message);
});
}, function() {
console.log("delete image fail:" + e.message);
});
}, function() {
//文件不存在
entry.copyTo(root, 'head.png', function(e) {
var path = e.fullPath + "?version=" + new Date().getTime();
console.log(entry.toLocalURL());
document.getElementById("cphpic").src = entry.toLocalURL();
uploadHead(path); /*上传图片*/
}, function(e) {
console.log('copy image fail:' + e.message);
});
});
}, function(e) {
console.log("get _www folder fail");
})
}, function(e) {
console.log("读取拍照文件错误：" + e.message);
});
}, function(a) {}, {
filter: "image"
})
}; //上传头像图片 B5教程网 www.bcty365.com
function uploadHead(imgPath) {
var image = new Image();
image.src = imgPath;
image.onload = function() {
var imgData = getBase64Image(image);
var imgcode = encodeURI(imgData);
console.log(imgData);
var data = "image=" + imgcode + "&multi_detect=false" var requrl = "https://aip.baidubce.com/rest/2.0/ocr/v1/license_plate?";
var access_token = "24.fd0f63529528e77f5c13c1bcee4629a7.2592000.1552721942.282335-15558877";
var accurl = requrl + "access_token=" + access_token; mui.ajax(accurl, {
data: {
'image': imgData,
'multi_detect': "false"
},
dataType: 'json',
type: 'post',
timeout: 10000,
success: function(data) {
if(data.words_result==null){
console.log("E");
$("#cph").val("");
$("#bkrst").val("");
}else{
console.log("S");
console.log(data.words_result.number);
document.getElementById('cph').value = data.words_result.number;
var str = data.words_result.number + '\r\n' + data.words_result.color;
//document.getElementById('bkrst'). = data.words_result.number;
$("#bkrst").val(str);
}
},
error: function(xhr, type, errorThrown) {
console.log("32323");
mui.toast('网络异常，请稍后再试！');
}
}); }
} // function ajax(url, fnSucc, fnFaild) {
// //1.创建对象
// var oAjax = null;
// if(window.XMLHttpRequest) {
// oAjax = new XMLHttpRequest();
// } else {
// oAjax = new ActiveXObject("Microsoft.XMLHTTP");
// }
//
// //2.连接服务器
// oAjax.open('GET', url, true); //open(方法, url, 是否异步)
//
// //3.发送请求
// oAjax.send();
//
// //4.接收返回
// oAjax.onreadystatechange = function() { //OnReadyStateChange事件
// if(oAjax.readyState == 4) { //4为完成
// if(oAjax.status == 200) { //200为成功
// fnSucc(oAjax.responseText)
// } else {
// if(fnFaild) {
// fnFaild();
// }
// }
// }
// };
// } //将图片压缩转成base64
function getBase64Image(img) {
var canvas = document.createElement("canvas");
var width = img.width;
var height = img.height;
// calculate the width and height, constraining the proportions
if(width > height) {
if(width > 100) {
height = Math.round(height *= 100 / width);
width = 100;
}
} else {
if(height > 100) {
width = Math.round(width *= 100 / height);
height = 100;
}
}
canvas.width = width; /*设置新的图片的宽度*/
canvas.height = height; /*设置新的图片的长度*/
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height); /*绘图*/
var dataURL = canvas.toDataURL("image/png", 0.8);
return dataURL.replace("data:image/png;base64,", "");
} // var url="https://aip.baidubce.com/rest/2.0/image-classify/v2/advanced_general";
// var access_token="24.161aadc20db180b6f7246a9bde7cca09.2592000.1538896023.282335-11785013";
// var setupurl = url + "access_token=" + access_token;
// var base64=canvas.toDataURL("../../images/pic.png",0.1);
// var imgdata=null;
// function $(id) {
// return document.getElementById(id);
// };
//
// $("#cph").change(function () {
// var cph = document.getElementById("cph").files;
// cph = validateUp(cph);
// var url = window.URL.createObjectURL(cph[0]);
// //转base64
// var canvas = document.createElement('CANVAS'),
// ctx = canvas.getContext('2d'),
// img2 = new Image;
// img2.crossOrigin = 'Anonymous';
// img2.onload = function () {
// var height = img2.height;
// //console.log("========原始高========" + height);
// var width = img2.width;
// //console.log("========原始宽========" + width);
// if (height > width) {
// height = img2.width;
// width = img2.height;
// //console.log("====" + width + "====转换height========" + height + "===" + height + "==转换width======" + width);
// }
// var scale = width / height;
// //console.log("--比例--" + scale);
// // 图片宽度压缩
// var width1 = img2.width;
// if (width < 500) {
// width1 = width;
// } else if (width < 1000) {
// width1 = width / 2;
// } else if (width < 2000) {
// width1 = width / 4;
// } else if (width < 3000) {
// width1 = width / 6;
// } else if (width < 4000) {
// width1 = width / 8;
// } else if (width < 5000) {
// width1 = width / 10;
// }
// //console.log("========调整后宽========" + width1);
// //console.log("========调整后高========" + parseInt(width1 / scale));
// // 创建属性节点
// var anw = document.createAttribute("width");
// anw.nodeValue = width1;
// var anh = document.createAttribute("height");
// anh.nodeValue = parseInt(width1 / scale);
// canvas.setAttributeNode(anw);
// canvas.setAttributeNode(anh);
// ctx.drawImage(img2, 0, 0, width1, parseInt(width1 / scale));
// var base64 = canvas.toDataURL('image/jpeg', 0.1);
// if (base64 != null && base64 != "" && base64 != "undefined") {
// var imgData = base64.replace("data:image/jpeg;base64,", "");
// //imgData = encodeURI(imgData);
// getLicense(imgData);
// //console.info("========images========" + JSON.stringify(imgData));
// }
// canvas = null;
// };
// img2.src = url;
// });
</script> </body> </html>
注意代码144行，替换access_token值
3.测试
点击拍照
自动识别车牌号及颜色
APP-9-文字识别-车牌识别的更多相关文章
- VIN码识别/车牌识别：是入口，是门面
汽车后市场高速发展下,汽车用品.零配件及售后服务已经从实体店延伸至线上,无论是整车厂.4S店.传统的汽修店,还是汽配商,都渴望用更合理的.高效的方式,实现运营管理上的突破. 广州云实信息科技有限公司( ...
- 移动端车牌识别、行驶证识别OCR为共享汽车APP增添技术色彩
本文主题:移动端车牌识别.行驶证识别OCR为共享汽车APP增添技术色彩 本文关键词:车牌识别,证件识别,移动端车牌识别,行驶证识别,手机车牌识别,驾驶证识别 近两年,随着共享单车以及共享电车的兴起,有 ...
- 手持式停车收费管理系统全套案例，支持车牌识别，包含了android版app，微信小程序查询，响应式管理后台，云端大数据存储
先展示几个app效果图片吧,使用起来非常方便,关联了机器的快捷键操作,操作速度提高了不少,摄像头车牌自动识别,车牌识别无网络情况下离线也可以使用 再来一张后台截图,停车场信息完整显示,今日数据实时 ...
- Delphi百度文字识别【支持通用文字识别、身份证识别、银行卡识别、驾驶证识别、行驶证识别、车牌识别等功能】
作者QQ:(648437169) 点击下载➨Delphi百度文字识别 百度api文档 [Delphi百度文字识别]支持 通用文字识别.通用文字识别(高精度版).通用文字识别(含位置信 ...
- 交警也觉得妙——Python 识别车牌
车牌识别在高速公路中有着广泛的应用,比如我们常见的电子收费(ETC)系统和交通违章车辆的检测,除此之外像小区或地下 车库门禁也会用到,基本上凡是需要对车辆进行身份检测的地方都会用到. 一些背景: 车牌 ...
- 移动端车牌识别——可以嵌入智能手机系统里的新OCR识别技术
移动端车牌识别技术,是在OCR光学字符识别技术的基础上研发的用来识别汽车号牌特征信息的图像识别技术.在国内,该项技术由北京易泊时代携手清华大学成功地将"国家863计划"项目成果-- ...
- javacpp-opencv图像处理系列：国内车辆牌照检测识别系统（万份测试车牌识别准确率99.7%以上，单次平均耗时39ms）
javaCV图像处理系列: 一.javaCV图像处理之1:实时视频添加文字水印并截取视频图像保存成图片,实现文字水印的字体.位置.大小.粗度.翻转.平滑等操作 二.javaCV图像处理之2:实时视频添 ...
- 车牌识别OCR—易泊时代智慧城市解决方案模块
牌识别(License Plate Recognition,LPR) 是视频图像识别技术在智能交通领域中的一个模块.车牌识别运用OCR技术,将视频流或图片中的汽车牌照从复杂的应用场景中提取并识别出来, ...
- 基于百度AI实现 车牌识别
前言 目前百度的AI接口相对完善,对于文字识别类的操作还需要开发者一一去尝试,去评估这效果到底是怎么的. 文字识别的接口相对简单,官方提供的SDK也集成很好,笔者只是在这上面做了一些前期性的功能数据校 ...
随机推荐
- mina2中的session
简介 session类图 Mina每建立一个连接同时会创建一个session对象,用于保存这次读写需要用到的所有信息.从抽象类AbstractIoSession中可以看出session具有如下功能: ...
- [转][C#]TopSelf
新建一个批处理,用于启动 TopSelf 服务 @echo off Service.exe install net start Service 或者简化成 @echo off Service.exe ...
- 廖雪峰Java-3流程控制-7for循环
for循环 for循环使用计数器实现循环 for循环条件需要设置:计数器初始值:循环前检测条件:每次循环后如何更新计数器 计数器变量通常命名为i int[] ns = {1,4,9,16,25}; f ...
- linux 查看进程启动路径
在linux下查看进程大家都会想到用 ps -ef|grep XXX 可是看到的不是全路径,怎么看全路径呢? 每个进程启动之后在 /proc下面有一个于pid对应的路径 例如:ps -ef|grep ...
- 清除OpenStack网络与路由
下面,我们以删除一个路由设备为例,讲解整个过程(以下命令都在控制节点执行) 列出所有路由设备,获得要删除的路由器id # neutron router-list [root@controller ~] ...
- Jmeter（二十）Beanshell or JSR223
有关Beanshell和JSR223组件的部分,早就想写一大篇幅随笔进行记录,苦于不知如何去描述这两部分的内容,一直在修改随笔. 介绍一下Beanshell: Beanshell是轻量级Java,支持 ...
- [UE4]统一颜色
这里说的统一颜色,说的是每个玩家看到另外的一个玩家的颜色都是一致的,而不是同一个队伍相同的颜色. 一.同样的在ShooterPlayerState中添加一个变量Color(队伍颜色),设置为可复制. ...
- laravel文件上传报错 stream_socket_sendto():
原因:文件超过限定大小或没指定临时目录 修改php.ini配置 file_uploads = On ; Temporary directory for HTTP uploaded files (wil ...
- vue 动态路由 Get传值
main.js //2.配置路由 注意:名字 const routes = [ { path: '/home', component: Home }, { path: '/news', compone ...
- MySQL 索引建立原则及注意事项
一.索引建立的几大原则: 1) 最左前缀匹配原则,非常重要的原则,mysql会一直向右匹配直到遇到范围查询(>.<.between.like)就停止匹配,比如a = 1 and b = 2 ...