图片文字识别(OCR)插件Ocrad.js教程


Posted in Javascript onNovember 26, 2018

下面通过一个简单的 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 相关文章推荐
JavaScript入门教程(2) JS基础知识
Jan 31 Javascript
js实现一个省市区三级联动选择框代码分享
Mar 06 Javascript
artdialog的图片/标题以及关闭按钮不显示的解决方法
Jun 27 Javascript
js调用浏览器打印模块实现点击按钮触发自定义函数
Mar 21 Javascript
js实现iGoogleDivDrag模块拖动层拖动特效的方法
Mar 04 Javascript
JavaScript基于setTimeout实现计数的方法
May 08 Javascript
BootStrap Typeahead自动补全插件实例代码
Aug 10 Javascript
js实现随机抽选效果、随机抽选红色球效果
Jan 13 Javascript
微信小程序 密码输入(源码下载)
Jun 27 Javascript
EasyUI创建人员树的实例代码
Sep 15 Javascript
JS实现横向轮播图(中级版)
Jan 18 Javascript
微信小程序 接入腾讯地图的两种写法
Jan 12 Javascript
JS 验证码功能的三种实现方式
Nov 26 #Javascript
trackingjs+websocket+百度人脸识别API实现人脸签到
Nov 26 #Javascript
tracking.js页面人脸识别插件使用方法
Apr 16 #Javascript
详解Node.js 中使用 ECDSA 签名遇到的坑
Nov 26 #Javascript
Vue.js的动态组件模板的实现
Nov 26 #Javascript
解决Vue开发中对话框被遮罩层挡住的问题
Nov 26 #Javascript
Vue项目部署在Spring Boot出现页面空白问题的解决方案
Nov 26 #Javascript
You might like
Windows下的PHP安装文件线程安全和非线程安全的区别
2014/04/23 PHP
php实现四舍五入的方法小结
2015/03/03 PHP
解决windows上php xdebug 无法调试的问题
2020/02/19 PHP
javascript字典探测用户名工具
2006/10/05 Javascript
javascript 自动填写表单的实现方法
2010/04/09 Javascript
javascript创建对象、对象继承的实用方式详解
2016/03/08 Javascript
Angular搜索 过滤 批量删除 添加 表单验证功能集锦(实例代码)
2017/10/25 Javascript
微信小程序radio组件使用详解
2018/01/31 Javascript
如何以Angular的姿势打开Font-Awesome详解
2018/04/22 Javascript
浅析java线程中断的办法
2018/07/29 Javascript
Vue在页面数据渲染完成之后的调用方法
2018/09/11 Javascript
微信小程序实现简易table表格
2020/06/19 Javascript
vue-cli3环境变量与分环境打包的方法示例
2019/02/18 Javascript
js设置默认时间跨度过程详解
2019/07/17 Javascript
JS实现盒子拖拽效果
2020/02/06 Javascript
JS call()及apply()方法使用实例汇总
2020/07/11 Javascript
深入Python函数编程的一些特性
2015/04/13 Python
python3使用urllib模块制作网络爬虫
2016/04/08 Python
python遍历目录的方法小结
2016/04/28 Python
详解如何将python3.6软件的py文件打包成exe程序
2018/10/09 Python
Python3 单行多行万能正则匹配方法
2019/01/07 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
Python Pandas数据结构简单介绍
2019/07/03 Python
mac系统下Redis安装和使用步骤详解
2019/07/09 Python
Python实现一个简单的毕业生信息管理系统的示例代码
2020/06/08 Python
美国校服网上商店:French Toast
2019/10/08 全球购物
.NET面试题:什么是反射
2016/09/30 面试题
年会主持词结束语
2014/03/27 职场文书
社区文化建设方案
2014/05/02 职场文书
师范类求职信
2014/06/21 职场文书
幼儿教师2014年度工作总结
2014/12/16 职场文书
前台接待岗位职责
2015/02/03 职场文书
2015年大学迎新晚会总结
2015/07/16 职场文书
2016机关干部作风建设心得体会
2016/01/21 职场文书
linux下导入、导出mysql数据库命令的实现方法
2021/05/26 MySQL
图片批量处理 - 尺寸、格式、水印等
2022/03/07 杂记