title: Get element position after drag and drop to pdf file (Angular-Nodejs)
body: <p>I use angular ng2-pdf-viewer and angular material cdkDrag to drag element.
  In my backend i use hummusJS/hummusRecipe to modify the pdf file.</p>
  
  <p>I look for a way to know where i drop the element on the pdf file and then make a request to backend with coordinate to know where the element need to be on the pdf file.</p>
  
  <p>This is my function on nodejs:</p>
  
  <pre><code>const pdfEditor = async () =&gt; {
    const pdfDoc = new HummusRecipe("./pdf/demo.pdf", "./pdf/output.pdf");
    pdfDoc
      // edit 1st page
      .editPage(1)
      .text("Add some texts to an existing pdf file", 150, 500, {
        color: "003240"
      })
      .image("./dest/signature.png", 100, 600, {
        width: 100,
        keepAspectRatio: true
      })
      .endPage()
      .endPDF();
  }
  </code></pre>
  
  <p>My client Angular:</p>
  
  <pre><code>&lt;div class="container"&gt;
  &lt;div class="otherContainer"&gt;
    &lt;button (click)="getEditedPDF()" style="width: 100px;"&gt;Save image with signature&lt;/button&gt;
    &lt;pdf-viewer *ngIf="pdfSrc" [(page)]="pageVariable" [show-all]="true" [render-text]="true" [original-size]="false" [autoresize]="true" [src]="pdfSrc"&gt; &lt;/pdf-viewer&gt;
    &lt;div class="signatureContainer"&gt;
      &lt;signature-pad [options]="signaturePadOptions" (onBeginEvent)="drawStart()"&gt;&lt;/signature-pad&gt;
      &lt;div class="btn-grid"&gt;
        &lt;button (click)="submitPad()"&gt;Submit&lt;/button&gt;
        &lt;button (click)="clearPad()"&gt;Clear Pad&lt;/button&gt;
        &lt;button (click)="openImage()"&gt;Open Image&lt;/button&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="image"&gt;
    &lt;img *ngIf="imageExpress" [src]="imageExpress | safeHtml" cdkDrag&gt;
  &lt;/div&gt;
  &lt;pdf-viewer *ngIf="editedPDF" [(page)]="pageVariable" [show-all]="true" [render-text]="true" [original-size]="false" [autoresize]="true" [src]="editedPDF"&gt; &lt;/pdf-viewer&gt;
  &lt;/div&gt;
  </code></pre>