tiendatleo
commented
2 years ago Same issue, too
Open srvarey opened 2 years ago
tiendatleo
commented
2 years ago Same issue, too
abishek-trainn
commented
2 years ago Any update?
megabild
commented
1 year ago I found out that version 1.9.2 works
ewchow
commented
1 year ago Since I went on this wild goose chase, thought I'd leave this for whomever else finds themselves here.
In v1.10.0 (the current version on npm), it uses pdfjs-dist v2.14.305 and it has an updated call signature for the update function in the PDFPageView class. It now accepts an object instead of positional arguments. pdfvuer calls PDFPageView.update using positional arguments.
In versions <=v1.9.2 and >=v2.0.0, pdfjs-dist was downgraded to v2.5.207, which has the positional arguments call signature instead of an object call signature like v2.14.305.
pdfvuer >=v2.0.0 seem to be built for Vue 3. I'm using Vue 2 and wanted to stick with v1.10.0 for the newer pdfjs-dist version, so I got around the bug using patch-package for the short term (if you don't already use it, it's great). I've also opened a PR.
Tayyab-Abbas
commented
1 year ago I have fixed this issue, and customarily handle the zoom-in and zoom-out flow, Here is the Available code in chunks that works with Vue.js, This code directly hit the style for dom classes to change the style customizable. If someone got any issue can contact me via email at "tayyababbaxi661@gmail.com". Thank you. Regard: Tayyab Abbas (Vue js and laravel developer)
`//template code is:
<div
v-if="showPdfConrols"
class="row pdf-bottom-button-container"
// data variables are:
data() {
return {
ebookApi: getApiState(),
currentPageNumber: 1,
totalPdfPages: null,
pdfScale: 1.0,
showPdfConrols: false,
currentPageInput: "1",
zoomLevel: 100,
maxZoomLevel: 125,
minZoomLevel: 75,
zoomValue: 0,
};
},
//methods are:
setDefaultZoom() {
this.zoomLevel = 100;
this.zoomValue = 0;
this.updatePdfStyle();
},
zoomIn() {
this.zoomLevel += 1;
this.zoomValue = 10;
this.updatePdfStyle();
},
zoomOut() {
this.zoomLevel -= 1;
this.zoomValue = -10;
this.updatePdfStyle();
},
updatePdfStyle() {
this.zoomHandeler(".page", this.zoomValue);
this.zoomHandeler(".canvasWrapper", this.zoomValue);
this.zoomHandeler("canvas", this.zoomValue);
this.zoomHandeler(".textLayer", this.zoomValue);
this.scrollHandeler();
},
zoomHandeler(className, zoomPixels) {
const element = document.querySelectorAll(className);
element.forEach((element) => {
const originalWidth = parseInt(element.style.width);
const originalHeight = parseInt(element.style.height);
if (!isNaN(originalWidth) && !isNaN(originalHeight)) {
element.style.width = ${originalWidth + zoomPixels}px;
element.style.height = ${originalHeight + zoomPixels}px;
}
});
},
`
The scale / zoom in / zoom out doesn't seem to work (has no effect) Can you provide code to show how I can handle scaling Thanks