Extracting text from a selected zone

[Matt Parizeau]

Q:

I need to draw a rectangle to let the user select a zone and get the text underneath it. Is this possible?

A:

Yes, here is some sample code of a custom tool that can do this:

Tools.TextTool['SELECTION_MODE'] = "rectangular";

var TextExtractTool = function(docViewer) {
  Tools.RectangleCreateTool.apply(this, arguments);
};
TextExtractTool.prototype = new Tools.RectangleCreateTool();

$(document).on("documentLoaded", function(event) {
  $('#overflowToolsContainer').prepend('<span data-toolmode="TextExtract" class="annotTool glyphicons" title="Image Selection"><img src="myimage.png"/></span>');

  var am = readerControl.getDocumentViewer().getAnnotationManager();
  var textExtractTool = 'TextExtract';
  readerControl.toolModeMap[textExtractTool] = new TextExtractTool(readerControl.docViewer);

  readerControl.toolModeMap[textExtractTool].on('annotationAdded', function(e, annotation) {
    getSelectedText(annotation, function(text) {
      alert('Extracted Text: ' + text);
      var annotManager = readerControl.docViewer.getAnnotationManager();
      annotManager.deleteAnnotation(annotation);
    });
  });

  function getSelectedText(annotation, callback) {
    var docViewer = readerControl.docViewer;
    docViewer.on('textSelected.highlight', function(e, quads, text) {
      docViewer.off('textSelected.highlight');
      docViewer.clearSelection();
      callback(text);
    });

    var topLeft = {
      x: annotation.X,
      y: annotation.Y,
      pageIndex: annotation.PageNumber - 1
    };
    var bottomRight = {
      x: annotation.X + annotation.Width,
      y: annotation.Y + annotation.Height,
      pageIndex: annotation.PageNumber - 1
    };
    var textSelectTool = new Tools.TextSelectTool(docViewer);
    textSelectTool.select(topLeft, bottomRight);
  }

  readerControl.setToolMode(textExtractTool);
});