I have incorporated the pdf canvas to showcase PDFs on my AngularJS/Bootstrap application, and I must say, the preview feature is working exceptionally well. However, one thing that I would like to achieve is centering either my modal or the canvas itself when zooming in using the following code:
<button type="button" class="btn btn-default" data-ng-click="zoomIn()">
<span class="glyphicon glyphicon-zoom-in"></span>
</button>
Below are the div containers I am utilizing:
<div>
<canvas id="pdf-canvas" class="rotate0"></canvas>
</div>
<div class="pdfTemplateModal">
<span class="glyphicon glyphicon-remove close" data-ng-click="vm.closePdfTemplateModal()"></span>
<div class="pdfPreviewWrapper">
<ng-pdf template-url="app/project/templates/pdfTemplate.html" canvasid="pdf-canvas" page="1" scale=1 debug="true" ></ng-pdf>
</div>
</div>
Is there a way to centrally position the canvas upon zooming in? The current setup situates the canvas at the top-left corner of my AngularJS/Bootstrap modal, but ideally, it should be centered upon zooming.