#Optical Character Recognition in JavaScript
In a world of ever increasing JavaScript libraries, you start to wonder if there is any task left that can not be done by JavaScript. Right from making 3D games in the browser to creating apps for your smartphones or running terminal emulators on your browser, the numerous JavaScript libraries available today help you in doing anything that you can imagine. In this post, we are going to have a look at a number of JavaScript libraries that help you in optical character recognition.
##Basic OCR demo by Heaton Research Demo
The very first example that we look at is a OCR recognition program that has the capability to recognize basic numbers traced on a canvas, using Euclidean distance comparisons.
Although it can recognize only numbers, it is interesting to note that you can teach it to recognize characters for you, and also remove existing characters.
One downside with this example is that it has no mention of the code, either snippets or an option to download.
Ocrad is one of the most popular optical screen readers, written purely in JavaScript. Inspired by Tesseract, Ocrad is a realtively simpler implementation in comparison. It is the JavaScript version of the Ocrad project. Let’s see how it performs on our test.
We are going to use the following image, which is a screenshot of my author bio in SitePoint, for testing the different tools (whenever applicable).
It doesn’t do that well. Half of the characters are not recognized even though the provided image is pretty clear. Let’s try something different.
It fails our scribble test too. Perhaps, it’s meant for just basic OCR. Don’t use it for your major projects just yet. There is a similar OCR demo available by the same user antimatter15 on GitHub pages. You can take a look here. It is based on the GOCR program, but gives strikingly similar results to Ocrad.
JS-OCR-demo is not an OCR in itself but a demo that uses Ocrad, along with a few other improvements. The creator of this demo correctly recognizes that there are some basic issues with Ocrad and tries to rectify them with certain other JavaScript libraries. You need a webcam to use this service.
First, you take a picture of some clean, large text and then crop the image to your required area. You are then asked to adjust the brightness and contrast of the image so as to make it easier to recognize. Let’s see if it works by grabbing the newspaper next to me.
After a few failed attempts to read “Delhi” and “ELECTIONS”, we finally get a successful recognition for “good”!
If you ask me, that’s a bit too much work for something that is not perfect. An uploading feature in this demo would have been better though!
##Conclusion Many OCR tools are available online that are not developed in JavaScript. One such example is the demo of MyScript, which can recognize text using far advanced technology. As we have seen in the examples above, although it’s possible to perform OCR in JavaScript, current tools are not advanced enough for practical use. Maybe a time will come when JavaScript libraries would be able to perform the task of OCR perfectly, but as of now, if you are planning to use such a tool, I suggest you try out Tesseract or go for a paid version.