diff options
Diffstat (limited to 'src/client/views/nodes/PDFBox.tsx')
-rw-r--r-- | src/client/views/nodes/PDFBox.tsx | 14 |
1 files changed, 8 insertions, 6 deletions
diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx index 37807e818..1de4d2512 100644 --- a/src/client/views/nodes/PDFBox.tsx +++ b/src/client/views/nodes/PDFBox.tsx @@ -267,8 +267,8 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { @action loaded = (nw: number, nh: number, np: number) => { this.dataDoc[this._props.fieldKey + '_numPages'] = np; - Doc.SetNativeWidth(this.dataDoc, Math.max(Doc.NativeWidth(this.dataDoc), nw * Pdfjs.PixelsPerInch.PDF_TO_CSS_UNITS)); - Doc.SetNativeHeight(this.dataDoc, nh * Pdfjs.PixelsPerInch.PDF_TO_CSS_UNITS); + Doc.SetNativeWidth(this.dataDoc, Math.max(Doc.NativeWidth(this.dataDoc), nw)); + Doc.SetNativeHeight(this.dataDoc, nh); this.layoutDoc._height = NumCast(this.layoutDoc._width) / (Doc.NativeAspect(this.dataDoc) || 1); !this.Document._layout_fitWidth && (this.Document._height = NumCast(this.Document._width) * (nh / nw)); }; @@ -584,7 +584,9 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { @computed get renderPdfView() { TraceMobx(); const previewScale = this._previewNativeWidth ? 1 - this.sidebarWidth() / this._previewNativeWidth : 1; - const scale = previewScale * (this._props.NativeDimScaling?.() || 1); + // PDFjs scales page renderings to be the render container size times the ratio of CSS/print pixels. + // So we have to scale the render container down by this ratio, so that the renderings will match the size of the container + const viewScale = (previewScale * (this._props.NativeDimScaling?.() || 1)) / Pdfjs.PixelsPerInch.PDF_TO_CSS_UNITS; return !this._pdf ? null : ( <div className="pdfBox" @@ -595,9 +597,9 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { <div className="pdfBox-background" onPointerDown={e => this.sidebarBtnDown(e, false)} /> <div style={{ - width: `calc(${100 / scale}% - ${(this.sidebarWidth() / scale) * (this._previewWidth ? scale : 1)}px)`, - height: `${100 / scale}%`, - transform: `scale(${scale})`, + width: `calc(${100 / viewScale}% - ${(this.sidebarWidth() / viewScale) * (this._previewWidth ? viewScale : 1)}px)`, + height: `${100 / viewScale}%`, + transform: `scale(${viewScale})`, position: 'absolute', transformOrigin: 'top left', top: 0, |