ngPdf - zoomOut 和 zoomIn - center

Question

我使用 pdf canvas 在我的 AngularJS/Bootstrap 应用程序中预览 PDF。这个预览效果非常好。我唯一需要做的就是将我的模态或 canvas 居中放大：

<button type="button" class="btn btn-default" data-ng-click="zoomIn()">
    <span class="glyphicon glyphicon-zoom-in"></span>
</button>

这些是我的 div 个容器：

<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>

放大时是否可以将 canvas 居中？目前 canvas 固定在我的 AngularJS/Bootstrap 模式的左上角，但在放大时它应该居中。

Answer 1

1. Delete for .wrapper "width"

2. For ng-pdf add

    display: flex;
    flex-direction: column;
    margin: auto;
    justify-content: center;
    align-items: center;

3. For NAV add
    width: 1000px;

4. For H1 add 
    width: 1000px;
    margin: auto;

看我对这个的结果link - https://www.screenmailer.com/v/ikcGUb7B91yaNlA

ngPdf - zoomOut 和 zoomIn - center

ngPdf - zoomOut and zoomIn - center

css

canvas

zooming

angularjs