ngPdf - zoomOut和zoomIn - center

我使用pdf畫布在我的AngularJS/Bootstrap應用程序中預覽PDF。這個預覽效果非常好。我唯一需要的是居中或者我的模式或畫布時變焦與：ngPdf - zoomOut和zoomIn - center

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

有居中畫布的可能性放大時？目前畫布固定在我的AngularJS /自舉模式的左上角，但它應該在變焦時中心

來源

2017-02-28 quma

你嘗試使用一個簡單的CSS規則爲它的容器？ – aUXcoder

你可以設置一個工作演示嗎？ –

這是該項目的演示，我以相同的方式使用它：https://sayan.ee/angularjs-pdf/ - 非常感謝您的幫助！ – quma

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;

看我的結果這個鏈接 - https://www.screenmailer.com/v/ikcGUb7B91yaNlA

來源

2017-03-06 10:47:19 grinmax

嗯，我仍然有這個問題的問題。是否有可能提供有關此問題的完整CSS？非常感謝！ – quma

@ user3318489我在瀏覽器檢查器中執行此操作。告訴我你的結果 – grinmax

ngPdf - zoomOut和zoomIn - center

回答

相關問題