在canvas元素上使用Ocrad.js的错误

时间:2014-09-11 19:00:48

标签: javascript html5-canvas

我想使用Ocrad.js并开始我想制作一个更简单的http://antimatter15.com/ocrad.js/demo.html版本。 为了熟悉这个库,我编写了这个简单的例子,但文本没有被正确识别(我总是得到'。'作为输出)。

任何帮助都将不胜感激。

这是我的index.html

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/ocrad.js/ocrad.js"></script>
<script type="text/javascript" charset="utf-8" src="js/test.js"> </script>
<title>ocradjs test</title>test.js

</head>
<body>
<canvas id="OCRArea" width="800" height="400" style="border:1px solid #000000;"  > </canvas>
<div id="image"> </div>
</body>
</html>

这是我的js / test.js

$( document ).ready(function() {
        var ch;
        var cw;
        var canvas = document.getElementById("OCRArea");
        var ctx = canvas.getContext("2d");
        var imgData ;
        ctx.font="100px Georgia";
        ctx.fillText("Test!",10,100);
        cw = canvas.width;
        ch = canvas.height;

        imgData = ctx.getImageData(0, 0, cw, ch);
        console.log(OCRAD(imgData));
        console.log(OCRAD(canvas));
        });

1 个答案:

答案 0 :(得分:1)

那个Canvas只有我也是fillText,&#34; - &#34;被调查是因为它被认为是。

当背景透明但不幸的是,字符无法识别。

请尝试以下操作。

var ch;
var cw;
var canvas = document.getElementById("OCRArea");
var ctx = canvas.getContext("2d");
var imgData ;

cw = canvas.width;
ch = canvas.height;

ctx.fillStyle = "rgb(255, 255, 255)";
ctx.fillRect(0, 0, cw, ch);
ctx.fillStyle = "rgb(0, 0, 0)";

ctx.font="100px Georgia";
ctx.fillText("Test!",10,100);

imgData = ctx.getImageData(0, 0, cw, ch);
console.log(OCRAD(imgData));