aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/PDFBox.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/PDFBox.tsx')
-rw-r--r--src/client/views/nodes/PDFBox.tsx14
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,