PDF.js get/show hightlight

gistfile1.js

function getHightlightCoords() {
var pageIndex = PDFViewerApplication.pdfViewer.currentPageNumber - 1; 
var page = PDFViewerApplication.pdfViewer.getPageView(pageIndex);
var pageRect = page.canvas.getClientRects()[0];
var selectionRects = window.getSelection().getRangeAt(0).getClientRects();
var viewport = page.viewport;
var selected = selectionRects.map(function (r) {
  return viewport.convertToPdfPoint(r.left - pageRect.x, r.top - pageRect.y).concat(
     viewport.convertToPdfPoint(r.right - pageRect.x, r.bottom - pageRect.y)); 
});
return {page: pageIndex, coords: selected};
}


function showHighlight(selected) {
var pageIndex = selected.page; 
var page = PDFViewerApplication.pdfViewer.getPageView(pageIndex);
var pageElement = page.canvas.parentElement;
var viewport = page.viewport;
selected.coords.forEach(function (rect) {
  var bounds = viewport.convertToViewportRectangle(rect);
  var el = document.createElement('div');
  el.setAttribute('style', 'position: absolute; background-color: pink;' + 
    'left:' + Math.min(bounds[0], bounds[2]) + 'px; top:' + Math.min(bounds[1], bounds[3]) + 'px;' +
    'width:' + Math.abs(bounds[0] - bounds[2]) + 'px; height:' + Math.abs(bounds[1] - bounds[3]) + 'px;');
  pageElement.appendChild(el);
});
}

This solution is not useful for several reasons:

1. It is an overlay on the top of the text, so it changes the view(color) of the text.
2. On the tablets it will work with problems.
3. The pdf.js TextLayer is rendered with incorrect fonts. That's why your highlight may be in incorrect place.
   The smooth way would be to make highlight using canvas. You need to construct charsMap of all characters rendered on the canvas by pdf.js. Then on mouse move you will need to find the char in charsMap and re-draw text with background on the top of pdf.js canvas. This drawing should be done in separate custom canvas.

Hi, I am working on this recently, I would like to discuss this with you.
About your problem :
No.1 you could add a svg layer under text layer to use rect to render the highlighted element then the text layer will not be changed.
No.2 curious to know why can't it work on tablet? cuz touch or something? (as i know ios selection have problem.)
No.3 you are right the text layer position is not 100% same with canvas text position. the canvas solution is great as i find the "apryse"(but it not open source and need pay) seems to use this solution. But I am not sure how much work need to do of this by self.

Is possible to get only position of click on document? in points?