JavaScript图片文字识别(OCR)插件Ocrad.js教程
2018-12-05 08:54
arsaycode
文章主要为大家详细介绍了图片文字识别(OCR)插件Ocrad.js教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
Ocrad.js 相当于是 Ocrad 项目的纯 JavaScript 版本,使用 Emscripten 自动转换。这是一个简单的 OCR (光学字符识别)程序,可以扫描图像中的文字回文本。
不像 GOCR.js,Ocrad.js 被设计成一个端口,而不是围绕可执行的包装。这意味着后续的图像处理,并不涉及重新初始化可执行代码,以便处理图像尽可能少的进行,因此它需要的时间仅为 GOCR.js 的八分之一。
GOCR.js 已在 github 进行开源,下载地址
ocrad.js 的csdn资源下载地址
下面通过一个简单的 demo 来讲解 Ocrad.js。
<
html
>
<
head
>
<
title
>业余草:www.xttblog.com</
title
>
<
style
>
body {
background: whiteSmoke;
font-family: sans-serif;
margin: 30px;
}
#transcription, #pic {
background: white;
display: inline-block;
border: 1px solid #ddd;
margin: 10px;
}
#transcription {
font-size: 30px;
padding: 30px;
min-width: 300px;
color: gray;
}
#transcription.done {
color: black;
}
#main {
display: flex;
}
</
style
>
</
head
>
<
body
>
<
h1
>Simple Ocrad.js Example</
h1
>
<
script
src
=
"../../ocrad.js"
></
script
>
<
script
>
function recognize_image(){
document.getElementById('transcription').innerText = "(Recognizing...)"
OCRAD(document.getElementById("pic"), function(text){
document.getElementById('transcription').className = "done"
document.getElementById('transcription').innerText = text;
})
}
</
script
>
<
div
id
=
"main"
>
<!-- CODE大全:www.codedq.net -->
<
img
id
=
"pic"
src
=
"img/message.png"
onload
=
"recognize_image()"
>
<
div
id
=
"transcription"
></
div
>
</
div
>
</
body
>
</
html
>
ocrad.js 的使用很简单,首先需要引入 ocrad.js 文件。
<script src=
"ocrad.js"
></script>
ocrad.js 提供了一个全局函数,ocrad以图像作为参数,以字符串的形式返回识别文本。
var
string = OCRAD(image);
alert(string);
以上就是JavaScript图片文字识别(OCR)插件Ocrad.js教程的全部内容,希望对大家的学习有所帮助。