百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

LEADTOOLS 创建基于HTML5的零占用OCR文字识别

zhezhongyun 2025-01-17 14:33 26 浏览

LEADTOOLS提供了屡获奖项的文字识别OCR开发包。使用全新的HTML5查看器和RESTful Web服务,你可以创建一个令人难以置信的识别应用程序,它能够运行在任意的台式电脑、平板电脑或移动设备上。无需牺牲移动设备的速度和功能,开发者现在可以享受到强大桌面应用程序拥有的所有好处。由于应用程序本质上是跨平台的,因此程序员可以节省很多时间以及测试的成本,在更新和维护应用程序时拥有一个更平和的心态。

LEADTOOLS SDK HTML5&OCR的主要功能

· 用于跨平台图像查看的HTML5/JavaScript Viewer控件。

· 支持HTML5,可以运行在任何台式机、平板电脑或移动设备上的浏览器。

· 支持鼠标和多点触控(手势)输入。

· 交互模式包括:

a. 平移

b. 缩放

c. 区域缩放

d. 以点为中心缩放

e. 放大镜

f. 合拢分开手指进行缩放

g. 回弹效果

· 基于物理和逻辑单元显示图像。

· 图像操作内置以下动作:

a. 旋转

b. 翻转

c. 缩放

· 本地化的图像注释和标记。

· 包含源码,易于定制和品牌化。

· 扩展LEADTOOLS RESTful Web服务,添加高级功能,如扩展后文件格式支持(TIFF、PDF、DOC、DICOM等),OCR和条码。

· 快速、准确、多线程的OCR文字识别引擎,用于桌面应用程序或高性能的服务器环境。

· 整页和区域OCR。

· 支持广泛的语言和字符集,包括拉丁文、斯拉夫字母、东亚语言和阿拉伯语。

· 强大的文档图像清理和预处理功能

· 从任意颜色、灰度或黑白图像中提取文本。

· 使用LEADTOOLS Cloud SDK轻松创建灵活的、强大的和高效的分布式OCR应用程序。

包含 HTML5 & OCR文字识别技术的SDK产品

HTML5 / JavaScript Viewer控件

这个例子我们使用到HTML5 Image Viewer控件,展示了如何调用OCR RESTful web服务。文章中的示例并没有包含所有代码。

OCR RESTful Web服务

LEADTOOLS OCR RESTful Web 服务是将OCR功能添加到任意应用程序中的简单方法,无需下载庞大的语言识别库和可执行程序。它只需要一组简单的参数(原始图像和识别区域),并将结果以容易解析的JSON结构返回。

在这个示例中,我们为您展示了如何使用web服务执行两种类别的识别:部分的或整页的。第一种通过使用查看器内置的rubber band事件选择一块小区域完成。使用鼠标单击拖动或手指触摸屏幕滑动,用户可以在图像中选择一个矩形,触发事件然后将它们的坐标传递给后台的web Service。

一旦服务按照onReadyStateChanged事件处理完成,你就可以使用JSON解析响应,根据应用程序的需要显示或使用识别出的文本。在下面的例子中,我们会在一个警告框中显示文字。

_selectRecognizeArea_RubberBandCompleted$1: 
 function HTML5DemosLibrary__ocrDemo$
_selectRecognizeArea_RubberBandCompleted$1(sender, e) {
   // 获取选中的区域,将它作为OCR文字识别的一个区域
var searchArea = Leadtools.LeadRectD.fromLTRB(e.get_point1.get_x, 
   e.get_point1.get_y, e.get_point2.get_x, e.get_point2.get_y);
   var visibleRect = _viewer.imageControlRectangle(true);
   searchArea.intersect(visibleRect);
   searchArea = _viewer.convertRect(Leadtools.Controls.CoordinateType.control, 
                Leadtools.Controls.CoordinateType.image, searchArea);
   if (searchArea.get_width > 3 && searchArea.get_height > 3) {
      this._recognize$1(searchArea);
   }
},

 
_recognize$1: function HTML5DemosLibrary__ocrDemo$_recognize$1(searchArea) {
   // 当等待时,显示正在加载的图片
   this.beginOperation;
   
   // 创建请求   
   var rest = this.buildServiceUrl('ocr.svc');
   rest += '/GetText?uri=';
   rest += _viewer.get_imageUrl;
   var imageSize = _viewer.get_imageSize;
   rest += '&width=';
   rest += parseInt(imageSize.get_width);
   rest += '&height=';
   rest += parseInt(imageSize.get_height);
   if (!searchArea.get_isEmpty) {
      // 没有选择,则识别整个页面
      rest += '&left=';
      rest += parseInt(searchArea.get_left);
      rest += '&top=';
      rest += parseInt(searchArea.get_top);
      rest += '&right=';
      rest += parseInt(searchArea.get_right);
      rest += '&bottom=';
      rest += parseInt(searchArea.get_bottom);
   }
   
  // 创建请求和事件句柄
   var request = new XMLHttpRequest;
   var _this = this;              
   var readyStateChanged = function {
      if (request.readyState === 4) {
         if (request.status === 200) {
            var results = null;
            if (request.responseText != null && request.responseText.length > 0) {
               results = JSON.parse(request.responseText);
            }
            else {
               alert('No text was found in the specified area, 
               please select another area that contains text and try again.');
            }
            request.onreadystatechange = null;
            request = null;
            _this.endOperation(false);
            if (results != null) {
               alert (results);
            }
         }
         else {
            _this.showRequestError(request);
         }
      }
   };
   
   // 发送请求
   request.onreadystatechange = readyStateChanged;
   request.open('GET', rest, true);
   request.send;
},

你可能注意到了如果没有给识别函数传递矩形,它会为整个图像创建一个矩形,然后调用web服务。因此程序员需要做的只是创建一个简单的按钮事件处理器完成整个页面的OCR。

var recognizeButton = document.getElementById('recognizeButton');
recognizeButton.addEventListener('click', function(e) {
   // 发送一个空区域,识别整个图像   
   _this._recognize$1(Leadtools.LeadRectD.get_empty);
}, false);

总结

LEADTOOLS为开发者提供了世界一流的稳定图像库。易用的高级编程接口使业务关键型应用程序的快速开发变为可能。

HTML5和OCR RESTful Web服务是LEADTOOLS诸多功能中的一个。

本站文章除注明转载外,均为本站原创或翻译

相关推荐

JPA实体类注解,看这篇就全会了

基本注解@Entity标注于实体类声明语句之前,指出该Java类为实体类,将映射到指定的数据库表。name(可选):实体名称。缺省为实体类的非限定名称。该名称用于引用查询中的实体。不与@Tab...

Dify教程02 - Dify+Deepseek零代码赋能,普通人也能开发AI应用

开始今天的教程之前,先解决昨天遇到的一个问题,docker安装Dify的时候有个报错,进入Dify面板的时候会出现“InternalServerError”的提示,log日志报错:S3_USE_A...

用离散标记重塑人体姿态:VQ-VAE实现关键点组合关系编码

在人体姿态估计领域,传统方法通常将关键点作为基本处理单元,这些关键点在人体骨架结构上代表关节位置(如肘部、膝盖和头部)的空间坐标。现有模型对这些关键点的预测主要采用两种范式:直接通过坐标回归或间接通过...

B 客户端流RPC (clientstream Client Stream)

客户端编写一系列消息并将其发送到服务器,同样使用提供的流。一旦客户端写完消息,它就等待服务器读取消息并返回响应gRPC再次保证了单个RPC调用中的消息排序在客户端流RPC模式中,客户端会发送多个请...

我的模型我做主02——训练自己的大模型:简易入门指南

模型训练往往需要较高的配置,为了满足友友们的好奇心,这里我们不要内存,不要gpu,用最简单的方式,让大家感受一下什么是模型训练。基于你的硬件配置,我们可以设计一个完全在CPU上运行的简易模型训练方案。...

开源项目MessageNest打造个性化消息推送平台多种通知方式

今天介绍一个开源项目,MessageNest-可以打造个性化消息推送平台,整合邮件、钉钉、企业微信等多种通知方式。定制你的消息,让通知方式更灵活多样。开源地址:https://github.c...

使用投机规则API加快页面加载速度

当今的网络用户要求快速导航,从一个页面移动到另一个页面时应尽量减少延迟。投机规则应用程序接口(SpeculationRulesAPI)的出现改变了网络应用程序接口(WebAPI)领域的游戏规则。...

JSONP安全攻防技术

关于JSONPJSONP全称是JSONwithPadding,是基于JSON格式的为解决跨域请求资源而产生的解决方案。它的基本原理是利用HTML的元素标签,远程调用JSON文件来实现数据传递。如果...

大数据Doris(六):编译 Doris遇到的问题

编译Doris遇到的问题一、js_generator.cc:(.text+0xfc3c):undefinedreferenceto`well_known_types_js’查找Doris...

网页内嵌PDF获取的办法

最近女王大人为了通过某认证考试,交了2000RMB,官方居然没有给线下教材资料,直接给的是在线教材,教材是PDF的但是是内嵌在网页内,可惜却没有给具体的PDF地址,无法下载,看到女王大人一点点的截图保...

印度女孩被邻居家客人性骚扰,父亲上门警告,反被围殴致死

微信的规则进行了调整希望大家看完故事多点“在看”,喜欢的话也点个分享和赞这样事儿君的推送才能继续出现在你的订阅列表里才能继续跟大家分享每个开怀大笑或拍案惊奇的好故事啦~话说只要稍微关注新闻的人,应该...

下周重要财经数据日程一览 (1229-0103)

下周焦点全球制造业PMI美国消费者信心指数美国首申失业救济人数值得注意的是,下周一希腊还将举行第三轮总统选举需要谷歌日历同步及部分智能手机(安卓,iPhone)同步日历功能的朋友请点击此链接,数据公布...

PyTorch 深度学习实战(38):注意力机制全面解析

在上一篇文章中,我们探讨了分布式训练实战。本文将深入解析注意力机制的完整发展历程,从最初的Seq2Seq模型到革命性的Transformer架构。我们将使用PyTorch实现2个关键阶段的注意力机制变...

聊聊Spring AI的EmbeddingModel

序本文主要研究一下SpringAI的EmbeddingModelEmbeddingModelspring-ai-core/src/main/java/org/springframework/ai/e...

前端分享-少年了解过iframe么

iframe就像是HTML的「内嵌画布」,允许在页面中加载独立网页,如同在画布上叠加另一幅动态画卷。核心特性包括:独立上下文:每个iframe都拥有独立的DOM/CSS/JS环境(类似浏...