Just need zoom and pan with viewer #17670

Gruski · 2024-02-14T10:00:48Z

Gruski
Feb 14, 2024

Not sure what I'm doing wrong as there is no example on how to use the viewer directly. I just want a fixed div as a container that does Ctrl-Wheel zoom/pan for desktop and pinch zoom/pan on mobile and nothing else. I will build my own chrome around it for the rest. With this code it renders the pages but there are no scroll bars no zoom with pinch, nothing.

<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
        <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1" />
        <link rel="stylesheet" href="PDFjs/web/viewer.css" />
        <script src="PDFjs/build/pdf.js"></script>
        <script src="PDFjs/web/pdf_viewer.js"></script>
    </head>
    <body>
        <div id="viewerContainer" style="position:absolute;width:100%;height:100px;">
            <div id="viewer" class="pdfViewer"></div>
        </div>
        <script>
            pdfjsLib.GlobalWorkerOptions.workerSrc = 'PDFjs/build/pdf.worker.js';

            const eventBus = new pdfjsViewer.EventBus();

            var loadingTask = pdfjsLib.getDocument('FileImage.ashx?ID=11510');
            loadingTask.promise.then(function (pdf) {
                var container = document.getElementById('viewerContainer');
                var viewer = new pdfjsViewer.PDFViewer({
                    container: container,
                    eventBus,
                    scale: 1.5,
                });
                viewer.setDocument(pdf);

                eventBus.on('pagesinit', function () {
                    viewer.currentScaleValue = 'page-width';
                });

            }, function (reason) {
                console.error(reason);
            });
        </script>
    </body>
</html>

lasseborly · 2024-03-21T20:47:50Z

lasseborly
Mar 21, 2024

The example is the /web directory in the repository.
I would use the whole example and cut away instead of starting from scratch. That way you have a functioning state to begin with.

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Just need zoom and pan with viewer #17670

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Just need zoom and pan with viewer #17670

Uh oh!

Gruski Feb 14, 2024

Replies: 1 comment

Uh oh!

lasseborly Mar 21, 2024

Gruski
Feb 14, 2024

lasseborly
Mar 21, 2024