破晓 发表于 2016-10-18 16:29:57

识别图片语言的 JS 库 Tesseract.js

<div class="detail TextContent" id="p_fullcontent" style="margin: 10px; line-height: 1.6; overflow: hidden; font-size: 13.3333px; color: rgb(0, 0, 0); font-family: &quot;Microsoft YaHei&quot;, Verdana, sans-serif, SimSun;"><h2 style="margin-bottom: 10pt; font-size: 14pt;">Tesseract.js&nbsp;</h2><h4 class="share__item-title">一个几乎能识别出图片中所有语言的JS库。</h4><p style="margin-bottom: 10px;"><img src="https://static.oschina.net/uploads/space/2016/1013/113138_AeKf_2903254.gif" data-bd-imgshare-binded="1" style="border: 0px; max-width: 700px;"></p><p style="margin-bottom: 10px;"><span id="result_box" class="">Tesseract.js使用脚本标签,webpack / browserify和节点</span>,<a href="https://github.com/naptha/tesseract.js#installation" target="_self" style="color: rgb(62, 98, 166); outline: 0px;">安装之后</a>,进行如下操作:</p><div><div id="highlighter_566835" class="syntaxhighlighterjava" style="width: 710px; margin-top: 1em !important; margin-bottom: 1em !important; position: relative !important; overflow: auto !important; font-size: 1em !important;"><div class="toolbar" style="box-shadow: rgba(198, 198, 198, 0.498039) 0px 1px 3px; height: 11px !important; vertical-align: baseline !important; border: none !important; border-radius: 0px !important; background: rgb(108, 226, 108) !important; bottom: auto !important; float: none !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: absolute !important; right: 1px !important; top: 1px !important; width: 11px !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 10px !important; min-height: auto !important; z-index: 10 !important; color: white !important;"><a href="https://www.oschina.net/p/tesseract-js#" class="toolbar_item command_help help" style="padding-top: 1px !important; color: white !important; outline: 0px !important; text-decoration: none !important; border-radius: 0px !important; background: none !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; overflow: visible !important; position: static !important; right: auto !important; text-align: center !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; display: block !important;">?</a></div><table border="0" cellpadding="0" cellspacing="0" style="width: 710px; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; border-radius: 0px !important; background: none !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important;"><tbody style="border-radius: 0px !important; background: none !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important;"><tr style="border-radius: 0px !important; background: none !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important;"><td class="gutter" style="padding: 0px !important; border-radius: 0px !important; background: none !important; border-width: 0px !important; border-style: initial !important; border-color: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; color: rgb(175, 175, 175) !important;"><div class="line number1 index0 alt2" style="padding-right: 0.5em !important; padding-left: 1em !important; border-radius: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border-width: 0px 3px 0px 0px !important; border-top-style: initial !important; border-right-style: solid !important; border-bottom-style: initial !important; border-left-style: initial !important; border-top-color: initial !important; border-right-color: rgb(108, 226, 108) !important; border-bottom-color: initial !important; border-left-color: initial !important; border-image: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; text-align: right !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; white-space: pre !important;">1</div><div class="line number2 index1 alt1" style="padding-right: 0.5em !important; padding-left: 1em !important; border-radius: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border-width: 0px 3px 0px 0px !important; border-top-style: initial !important; border-right-style: solid !important; border-bottom-style: initial !important; border-left-style: initial !important; border-top-color: initial !important; border-right-color: rgb(108, 226, 108) !important; border-bottom-color: initial !important; border-left-color: initial !important; border-image: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; text-align: right !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; white-space: pre !important;">2</div><div class="line number3 index2 alt2" style="padding-right: 0.5em !important; padding-left: 1em !important; border-radius: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border-width: 0px 3px 0px 0px !important; border-top-style: initial !important; border-right-style: solid !important; border-bottom-style: initial !important; border-left-style: initial !important; border-top-color: initial !important; border-right-color: rgb(108, 226, 108) !important; border-bottom-color: initial !important; border-left-color: initial !important; border-image: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; text-align: right !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; white-space: pre !important;">3</div></td><td class="code" style="width: 679px; padding: 0px !important; border-radius: 0px !important; background: none !important; border-width: 0px !important; border-style: initial !important; border-color: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important;"><div class="container" style="border-radius: 0px !important; background: none !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: relative !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important;"><div class="line number1 index0 alt2" style="padding-right: 1em !important; padding-left: 1em !important; border-radius: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; white-space: pre !important;"><code class="java plain" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">Tesseract.recognize(myImage)</code></div><div class="line number2 index1 alt1" style="padding-right: 1em !important; padding-left: 1em !important; border-radius: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; white-space: pre !important;"><code class="java spaces" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="java plain" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">.progress(function&nbsp;&nbsp;(p)&nbsp;{&nbsp;console.log(</code><code class="java string" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important; color: blue !important;">'progress'</code><code class="java plain" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">,&nbsp;p)&nbsp;&nbsp;&nbsp;&nbsp;})</code></div><div class="line number3 index2 alt2" style="padding-right: 1em !important; padding-left: 1em !important; border-radius: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-size: 1em !important; min-height: auto !important; white-space: pre !important;"><code class="java spaces" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="java plain" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">.then(function&nbsp;(result)&nbsp;{&nbsp;console.log(</code><code class="java string" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important; color: blue !important;">'result'</code><code class="java plain" style="white-space: nowrap; border: 0px !important; background: none !important; border-radius: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-family: Consolas, &quot;Bitstream Vera Sans Mono&quot;, &quot;Courier New&quot;, Courier, monospace !important; font-size: 1em !important; min-height: auto !important;">,&nbsp;result)&nbsp;})</code></div></div></td></tr></tbody></table></div></div><p style="margin-bottom: 10px;"><a href="https://github.com/naptha/tesseract.js#docs" target="_self" style="color: rgb(62, 98, 166); outline: 0px;"><span id="result_box" tabindex="-1">查看文档</span></a><span id="result_box" tabindex="-1">以了解API的完整处理。</span></p></div><div class="GithubEmbed" style="margin-right: 10px; margin-left: 10px; color: rgb(0, 0, 0); font-family: &quot;Microsoft YaHei&quot;, Verdana, sans-serif, SimSun; font-size: 13.3333px;"><div class="github-widget" data-repo="naptha/tesseract.js" style="margin-top: 10px; margin-bottom: 10px;"><div class="github-box repo" style="font-family: helvetica, arial, sans-serif; font-size: 13px; line-height: 18px; background: rgb(250, 250, 250); border: 1px solid rgb(221, 221, 221); color: rgb(102, 102, 102); border-radius: 3px;"><div class="github-box-title" style="position: relative; border-bottom: 1px solid rgb(221, 221, 221); border-radius: 3px 3px 0px 0px; background: -webkit-linear-gradient(top, rgb(252, 252, 252), rgb(235, 235, 235));"><h3 style="padding: 10px 10px 10px 80px; font-weight: normal; font-size: 16px; color: gray; background: url(&quot;https://www.oschina.net/img/github_logo.gif&quot;) left center no-repeat;"><a class="owner" href="https://github.com/naptha" target="_blank" style="color: rgb(65, 131, 196); outline: 0px; border: 0px; text-decoration: none;">naptha</a>&nbsp;/&nbsp;<a class="repo" href="https://github.com/naptha/tesseract.js" target="_blank" style="color: rgb(65, 131, 196); outline: 0px; border: 0px; text-decoration: none; font-weight: bold;">tesseract.js</a></h3><div class="github-stats" style="padding-left: 2px; position: absolute; top: 8px; right: 10px; background: white; border: 1px solid rgb(221, 221, 221); border-radius: 3px; font-size: 11px; font-weight: bold; line-height: 21px; height: 21px;">Watch<a class="watchers" title="Watchers" href="https://github.com/naptha/tesseract.js/watchers" target="_blank" style="padding-right: 5px; padding-left: 5px; color: rgb(102, 102, 102); outline: 0px; border-width: 0px 1px 0px 0px; border-top-style: initial; border-right-style: solid; border-bottom-style: initial; border-left-style: initial; border-top-color: initial; border-right-color: rgb(221, 221, 221); border-bottom-color: initial; border-left-color: initial; border-image: initial; text-decoration: none; display: inline-block; height: 21px; background-position: 3px -2px;">211</a>&nbsp;Star<a class="watchers" title="Watchers" href="https://github.com/naptha/tesseract.js/stargazers" target="_blank" style="padding-right: 5px; padding-left: 5px; color: rgb(102, 102, 102); outline: 0px; border-width: 0px 1px 0px 0px; border-top-style: initial; border-right-style: solid; border-bottom-style: initial; border-left-style: initial; border-top-color: initial; border-right-color: rgb(221, 221, 221); border-bottom-color: initial; border-left-color: initial; border-image: initial; text-decoration: none; display: inline-block; height: 21px; background-position: 3px -2px;">8043</a>&nbsp;Fork<a class="forks" title="Forks" href="https://github.com/naptha/tesseract.js/network" target="_blank" style="padding-right: 5px; padding-left: 5px; color: rgb(102, 102, 102); outline: 0px; border: 0px; text-decoration: none; display: inline-block; height: 21px; background-position: 0px -52px;">299</a></div></div><div class="github-box-content" style="padding: 10px;"><p class="description">Pure Javascript OCR for 62 Languages
页: [1]
查看完整版本: 识别图片语言的 JS 库 Tesseract.js