title: pdf-lib: Not able to draw text in a scanned pdf
body: <p>I'm trying to draw text in a rectangle a pdf using the pdf-lib library. It is possible for pdf files that are not scanned. See below screenshot:</p>
  <p><a href="https://i.stack.imgur.com/1NSx4.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1NSx4.png" alt="Text in rectangle - normal pdf file" /></a></p>
  <p>It doesn't work for scanned pdf files. Basically it's the <code>modifyPdf</code> function that does the job. We read the pdf file and then draw the rectangle and text. Then we encode it using base64 and set it as the iframe source. Please see below code:</p>
  <pre><code>&lt;?php
  if(isset($_GET['fname']))
  {
      $fname = trim($_GET['fname']);
      $fname_array = explode('/', $fname);
      $label_str = end($fname_array);
      $label_str = addslashes($label_str);
  }
  else
      die('Access denied');
  ?&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot; /&gt;
      &lt;title&gt;PDF Viewer&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;&lt;/body&gt;
  
   &lt;!--&lt;script src=&quot;js/pdf-lib.min.js&quot;&gt;&lt;/script&gt;--&gt;
   &lt;script src=&quot;https://unpkg.com/pdf-lib@1.11.1/dist/pdf-lib.js&quot;&gt;&lt;/script&gt;
  
  
  &lt;!-- &lt;script src=&quot;https://unpkg.com/pdf-lib@1.4.0&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;https://unpkg.com/downloadjs@1.4.7&quot;&gt;&lt;/script&gt; --&gt;
  
  &lt;script&gt;
  
      (async () =&gt; {
  
  
      //const { degrees, PDFDocument, rgb, StandardFonts } = PDFLib
  
      let FinalModifiedFilesToBeUploaded = await modifyPdf('&lt;?=$label_str?&gt;', 13, '&lt;?=$fname?&gt;')
  
      for (let i = 0; i &lt; FinalModifiedFilesToBeUploaded.length; i++) {
          let iframeSrc = FinalModifiedFilesToBeUploaded[i]
          let iframe = document.createElement('iframe')
          iframe.setAttribute('style', 'width: 100%; height: 100%;')
          iframe.setAttribute('src', iframeSrc)
          iframe.setAttribute('class', 'custom-pdf-frame')
          document.body.appendChild(iframe)
      }
  
      async function modifyPdf(text, textSize, path ) {
          let MODIFIED_FILES = []
        // Fetch an existing PDF document
        /*const url = 'https://pdf-lib.js.org/assets/with_update_sections.pdf'*/
        const url = path
          const existingPdfBytes = await fetch(url).then(res =&gt; res.arrayBuffer())
  
        const pdfDoc = await PDFLib.PDFDocument.load(existingPdfBytes)
                          const helveticaFont = await pdfDoc.embedFont(PDFLib.StandardFonts.Helvetica)
                          const textWidth = helveticaFont.widthOfTextAtSize(text, textSize);
                          // const textHeight = helveticaFont.heightAtSize(textSize);
                          const pages = pdfDoc.getPages()
                          const firstPage = pages[0]
                          console.log(firstPage)
                          if (firstPage) {
                              const {
                                  width,
                                  height
                              } = firstPage.getSize()
                              try{
                              console.log(firstPage.drawText(text, {
                                  x: width / 2 - textWidth / 2,
                                  y: height / 2 + 367,
                                  size: textSize,
                                  font: helveticaFont,
                                  opacity: 1,
                                  //color: PDFLib.rgb(0.13333333333333333, 0.5450980392156862, 0.13333333333333333),
                              }))
                              }
                              catch(err) {
    alert('test1'+err)
  }
  try{
                              firstPage.drawRectangle({
                                  x: width / 2 - textWidth / 2 - 10,
                                  y: height / 2 + 357,
                                  width: textWidth + 20,
                                  height: 30,
                                  borderWidth: 1,
                                  //color: PDFLib.rgb(1, 1, 0),
                                  opacity: 0.2,
                              })
  }
  catch(err) {
    alert('test2'+err)
  }
                              const pdfDataUri = await pdfDoc.saveAsBase64({
                                  dataUri: true
                              });
                              MODIFIED_FILES.push(pdfDataUri)
                          } else {
                              alert('Page not found')
                          }
  console.log(MODIFIED_FILES)
                          return MODIFIED_FILES
  
              // Trigger the browser to download the PDF document
        //download(pdfBytes, &quot;pdf-lib_modification_example.pdf&quot;, &quot;application/pdf&quot;);
      }
      })()
  &lt;/script&gt;
  
  &lt;/html&gt;
  </code></pre>