原創|使用教程|編輯:龔雪|2015-07-27 10:10:56.000|閱讀 539 次
概述:由于處理能力和存儲空間的制約,移動設備上的文字識別(OCR)一直是一個很大的挑戰。LEADTOOLS正在使用HTML5/JavaScript圖像查看器控件和RESTful Web服務改變這一切。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
LEADTOOLS提供了屢獲獎項的文字識別OCR開發包。使用全新的HTML5查看器和RESTful Web服務,你可以創建一個令人難以置信的識別應用程序,它能夠運行在任意的臺式電腦、平板電腦或移動設備上。無需犧牲移動設備的速度和功能,開發者現在可以享受到強大桌面應用程序擁有的所有好處。由于應用程序本質上是跨平臺的,因此程序員可以節省很多時間以及測試的成本,在更新和維護應用程序時擁有一個更平和的心態。
· 用于跨平臺圖像查看的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 Image Viewer控件,展示了如何調用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諸多功能中的一個。
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn