The PDF content exported on the Linux server is magnified by about 30%.

[Alex-Credifranco]

The PDF content exported on the Linux server is magnified by about 30%. It's good to export in Windows development environment. Does anyone have a problem? Ask God for help.

[giona69]

@Alex-Credifranco I have the same problem ... is this project still alive?

[VenomousMaterial]

Also experiencing this.

I'm on version 2.1.0.

[VenomousMaterial]

Until there is an official fix for this, I was able to get around it, for the most part, by adding a style of zoom: 0.75 to the tag of the document I was trying to convert. It isn't very precise, so more detailed documents might need a better fix, but it did the trick for my use case.

[Serhioromano]

Add to that HTML CSS with exact font size in px.

p, table tr td, table tr th, li, ol {
    font-size:10px;
    font-family: Impact;
    line-height: 2;
}

Also, make sure no other CSS is applied like bootstrap. Clean of all CSS and create your own fully control everything in PDF.

[Alex-Credifranco]

@Serhioromano Hello, how many PX should A4 paper be set in the project. var options = { "height": "1160px", // allowed units: mm, cm, in, px "width": "820px" }; I set it up like this. But the generated PDF size width: 1095px

[Serhioromano]

Here is my config

var options = {
	format: "A4",
	border: {
		top: "5mm",
		right: "5mm",
		bottom: "5mm",
		left: "5mm"
	},
	header: {
		height: "5mm",
		contents: '<div class="header">Автор: Сергей Романов</div>'
	},
	footer: {
		height: "5mm",
		contents: {
			first: " ",
			last: '<span class="footer">Стр. {{page}}</span>',
		}
	}
};

[Alex-Credifranco]

@Serhioromano I know the reason, but I don't know how to solve it. The reason is that the dpi of Linux and Windows export is different, the dpi of windows is 90, and the dpi of Linux is 72.

[damianijr]

same here, @Alex-Credifranco are using zoom 0.75 solution?

[damianijr]

zoom: 0.753 was the pixel-perfect workaround that I used, following thread to know when an official fix will release

[Alex-Credifranco]

@damianijr is "zoomFactor": "0.753"？Did not find zoom in the document.

[damianijr]

html { zoom: 0.753 }

@Alex-Credifranco

[nohaibogdan1]

Same problem

[guix77]

After a research I found that under the hood, phantomjs uses the default system screen resolution. This is not viewportSize and viewportSize must be smaller than this system limitation.

Say in local you have a 1920x1080 screen with Xorg and on your server you don't have Xorg. PhantomJS then uses the framebuffer resolution.

You can check the available fb resolutions on your server by installing fbset.

On Debian Buster:

sudo apt install fbset
sudo fbset -i

For me:

mode "1024x768"
    geometry 1024 768 1024 768 24
    timings 0 0 0 0 0 0 0
    accel true
    rgba 8/16,8/8,8/0,0/0
endmode

Frame buffer device information:
    Name        : cirrusdrmfb
    Address     : 0xfc000000
    Size        : 33554432
    Type        : PACKED PIXELS
    Visual      : TRUECOLOR
    XPanStep    : 1
    YPanStep    : 1
    YWrapStep   : 0
    LineLength  : 3072
    Accelerator : No

So there is only 1 fb resolution available and it's set:

sudo fbset -s

mode "1024x768"
    geometry 1024 768 1024 768 24
    timings 0 0 0 0 0 0 0
    accel true
    rgba 8/16,8/8,8/0,0/0
endmode

Phantomjs can use 1024x768 at best so the output is a lot bigger than on my 1920x1080. It's even less, my tests show that because of the browser borders, phantomjs can only use a max viewportSize of 1011x768.

I don't see any other solution than designing the HTML of the PDF in 1011x768 or less.

[jhon-andrew]

html { zoom: 0.753 }

@Alex-Credifranco

I've been tinkering with this for a couple of hours already and this solved the problem. Thanks a lot.

[szogun1987]

By default, dpi is set to primary screen's dpi https://github.com/ariya/phantomjs/blob/0a0b0facb16acfbabb7804822ecaf4f4b9dce3d2/src/webpage.cpp line 434

But it can be overridden by setting dpi value on page object line 658

html-pdf just has to expose this option

[Techno11]

For those still curious, here is how I implemented damianijr's solution

const fixedHtml = myHtmlString.replace("</head>", "<style>html {zoom: 0.75}</style></head>")

[dimar-hanung]

html { zoom: 0.753 }

@Alex-Credifranco Also use media print if you export image too, so export result not affected by zoom

@media print {
    html {
        zoom: 0.753;
    }
}