Detecting particular text in image

Question

Is there any html program using javascript,

1. To detect a particular text in given image

2. highlight it with rectangular box around it and

3. get the coordinates of corners of rectangle box?

Input Image: https://i.sstatic.net/I3sy6.png

Let's say I want to search for "Computer":

Then Expected Output should be: https://i.sstatic.net/N3Hxt.png with coordinates in console .

Answer 1

To do OCR (Optical Character Design) with JS, you can use Tesseract.js

Here is how it works (from the repo):

import Tesseract from 'tesseract.js';

Tesseract.recognize(
  'https://tesseract.projectnaptha.com/img/eng_bw.png',
  'eng',
  { logger: m => console.log(m) }
).then(({ data: { text } }) => {
  console.log(text);
})