Is there a way to zoom in on a pdf object on load?

May 18, 2023

In my laravel blade I have:

@php
     $file = "storage/006AJ000002BLbE/somePDF.pdf";
@endphp
     <object data={{$file}} width='100%' height='100%'>

and it loads just fine. however the pdf is very small print. is there a way to have it zoomed in on load?

something like this in laymen’s terms:

@php
 $file = "storage/006AJ000002BLbE/somePDF.pdf";
@endphp
 <object data={{$file}} width='100%' height='100%' zoom='6x'>

>Solution :

The tag doesn’t have a built-in zoom attribute. However, using JavaScript, you can get the effect of zooming in on a PDF object.

@php
     $file = "storage/006AJ000002BLbE/somePDF.pdf";
@endphp

<object id="pdfObject" data="{{$file}}" width="100%" height="100%"></object>

<script>
  window.addEventListener('DOMContentLoaded', function() {
    var pdfObject = document.getElementById('pdfObject');
    var zoomLevel = 2; // Set desired zoom level

    pdfObject.addEventListener('load', function() {
      var doc = pdfObject.contentDocument;
      var body = doc.querySelector('body');
      var scaleFactor = zoomLevel / 100; // Convert zoom level to decimal form

      body.style.transformOrigin = '0 0';
      body.style.transform = 'scale(' + scaleFactor + ')';
    });
  });
</script>