Simple OCR demo in JavaScript


Hi! I learned today about Ocrad.js which is
an Optical Character Recognition library in JavaScript. I decided to try it out. So,
my first idea was to grab image from the camera and read text being on that image. I started
by learning how to capture video in HTML5. Which is nicely described on html5rocks.com
Then, I found this glfx.js library that allows me to add some filters, apply some fileters
on the image. Like: change brightness, change contrast and do some sharpening. Which I will need to improve image from camera before extracting text. Lastly, I found a small jQuery plugin
that allowes me to easily crop images. I ended up with this. It’s a very simple demo. I will
now allow my browser to use the camera. Here I am and here is text that I will try to extract. Let me make a proper snapshot. OK. This should work. Now, I crop out the text that I want
to extract. OK. Now we have an image that we will try to read using Ocrad.js library.
As you can see it works very nicely. Actually, from what I tested all printed stuff, all printed text, is readed correctly, extracted correctly by Ocrad.js library. Handwriting
doesn’t really work, but maybe it’s just my handwriting which is awful. Yeah, and that’s
it. I will try to make this project available as soon I will be happy with it.
It’s currently in the, as you can see, early stage of development. Anyway, thanks for watching!

19 thoughts on “Simple OCR demo in JavaScript

  1. I'd like to be kept updated regarding the availability of your solution. I am looking for a number only recognition for an HTML mobile device, any leads here?

  2. Hi! This is really neat. Have you had any success using this for credit cards? Name, Number, Expiration date? – Tom

  3. well done.. thank you 
    I have a question (I know its not sutible here), but can I use this framework in PhoneGap to create a Mobile App? plesase if anyone just direct me.

  4. This is great ! thanks for the video – saved a lot of time and effort. I am trying to take a picture of printed materials, with the exception that the code has to decide how to crop the entire image into pieces and look for specific phrases, I believe your video pretty much has all the nuts and bolts needed. Thanks !

  5. dear sir i need a ocr for finding a wallmart bill text but this javascript is not find a single text of it

Leave a Reply

Your email address will not be published. Required fields are marked *