Ocrad.js 是一款开源的插件库，它能使 image（图片） 转换成文字。本文将介绍它的使用。
光学字符识别，简称OCR，是一种可以使你转换不同文档的技术，比如将扫描纸质文档,PDF文件或者数码相机拍摄的图片转换成可以编辑的文档。
整个 Ocrad.js 大概 3.06M。使用起来非常的方便。
首先我们需要下载Ocrad.js。
下载完成后，我们在 index.html 中引入Ocrad.js。
最后通过它的OCRAD函数，实现图片转文字。
全部代码如下：
<!doctype html>
<html>
<head>
<title>：www.xttblog.com</title>
<style>
body {
background: whiteSmoke;
font-family: sans-serif;
margin: 30px;
}
#transcription, #nose {
background: white;
display: inline-block;
border: 1px solid #ddd;
margin: 10px;
min-height: 300px;
flex-grow: 1;
}
#nose {
text-align: center;
font-size: 50px;
padding: 10px;
}
#nose img {
width: 400px;
}
#transcription {
font-size: 20px;
padding: 30px;
min-width: 300px;
color: gray;
}
#transcription.done {
color: black;
}
#main {
display: flex;
}
</style>
</head>
<body>
<h1>：www.xttblog.com</h1>
<script src="../../ocrad.js"></script>
<script>
function recognize_image(){
document.getElementById('transcription').innerText = "(Recognizing...)"
OCRAD(document.getElementById("pic"), {
numeric: true
}, function(text){
})
}
function load_file () {
var reader = new FileReader();
reader.onload = function(){
var img = new Image();
img.src = reader.result;
img.onload = function(){
document.getElementById('nose').innerHTML = ''
document.getElementById('nose').appendChild(img)
OCRAD(img, function(text){
document.getElementById('transcription').className = "done"
document.getElementById('transcription').innerText = text;
})
}
}
reader.readAsDataURL(document.getElementById('picker').files[0])
}
</script>
<input type="file" onchange="load_file()" id="picker">
<div id="main">
<div id="nose">
<p>No file loaded</p>
<p style="font-size: 25px"> Open a file first </p>
<p style="font-size: 15px">it's okay. I'll wait. </p>
<p style="font-size: 10px">no seriously, I can't move</p>
<p style="font-size: 8px">still waiting...</p>
</div>
<div id="transcription"></div>
</div>
</body>
</html>
参考资料
- Javascript图片文字识别（OCR）插件 Ocrad.js 教程
： » Js OCR 插件 Ocrad.js 实战
原创文章，作者：jamestackk，如若转载，请注明出处：https://blog.ytso.com/tech/aiops/251272.html