Prevent signature annotations from overlapping

FAQ
, , ,
1

Q: How can I prevent a signature from being placed over another signature?

A: You can override the mouseLeftUp prototype to check if it collides with any other signatures before it is placed onto the document. Here is a code snippet for v8.2:


Webviewer({
  path: '/lib',
}, document.getElementById('viewer')).then(async (instance) => {
  const { Tools, annotationManager, documentViewer, Annotations, Math } = instance.Core;

  const originalMouseLeftUp = Tools.SignatureCreateTool.prototype.mouseLeftUp;

  Tools.SignatureCreateTool.prototype.mouseLeftUp = function(e, widget) {
    const currentPage = documentViewer.getCurrentPage()
    const pageCoordinates = documentViewer.getDisplayModeManager().getDisplayMode().windowToPage(this.getMouseLocation(e), currentPage);
    const padding = 3;
    const annotationsList = annotationManager.getAnnotationsList().filter(annotation => {
      return annotation.PageNumber === currentPage
    });

    const mouseArea = new Math.Rect(
      pageCoordinates.x - this.annot.Width / 2 + padding,
      pageCoordinates.y - this.annot.Height / 2 + padding,
      pageCoordinates.x + this.annot.Width / 2 - padding,
      pageCoordinates.y + this.annot.Height / 2 - padding
    )

    const interactAnnotList = []
    annotationsList.forEach(annot => {
      const rect = annot.getRect();
      const annotationRect = new Math.Rect(rect.x1 + padding, rect.y1 + padding, rect.x2 - padding, rect.y2 - padding)
      if(annotationRect.intersects(mouseArea)) {
        interactAnnotList.push(annot)
      }
    })

    if(interactAnnotList.length > 0) {
      return;
    }

    originalMouseLeftUp.call(this, e)
  }
});