KoolReport's Forum

Official Support Area, Q&As, Discussions, Suggestions and Bug reports.
Forum's Guidelines

Koolreport and Export to PDF font issue #1104

Open AST opened this topic on on Sep 26, 2019 - 14 comments

AST commented on Sep 26, 2019

Hello,

I tried Export to PDF feature, apparently Windows and Linux fonts are not the same thus the exported report is not showing in the same way it supposed to be.

I tried to add an online font to standardize the font in Windows and Linux. But still, the exported pdf in Linux does not show the correct font either. XReport.view.php ` ...

    @import url('https://fonts.googleapis.com/css?family=PT+Sans&display=swap');

    html {
        font-family: 'PT Sans', sans-serif;
    }

... `

I searched online about phantomJS and apparently the project is dead now. Also have taken a look at chrome headless, but due to my project requirement, I need to host it locally (no internet connection in production server).

Any input / advice on this particular topic?

Thanks, AST

KoolReport commented on Sep 27, 2019

Please try to install the PT San font on your Linux system fonts

AST commented on Sep 27, 2019

I tried to install PT Sans in my linux server environment, but still no luck.

But if I tried locally on windows computer, it works.

AST commented on Sep 27, 2019

Ok, so instead of installing, right now I have included the font into my laravel project and it works if i run $report->run()->render();

However, export to PDF still does not work. :(

run render works

export pdf does not work

AST commented on Oct 1, 2019

Still no luck after trying so much on phantomjs. :(

I read this article, https://www.koolreport.com/forum/topics/557 I followed all of the step. In the temp folder I found the report in html format, but not in pdf format.

Any tips on this topic?

David Winterburn commented on Oct 2, 2019

Hi,

For using google fonts in linux, please try to install them locally like this guide:

Install Google Fonts

Google PT Sans

After that try to view and export your report using your installed font. Let us know if this approach works for you. Thanks!

AST commented on Oct 2, 2019

Tried that too.

But seems it is phantomjs issue as a lot of people faced the same issue as well (cmiiw). Currently I am trying to use puppeteer. HTML file generated, but pdf file is not. I did not receive any errors.

PATH=$PATH:/usr/local/bin NODE_PATH=`npm root -g` node "C:\Users\x\Documents\Project\a\vendor\its404\php-puppeteer\src/js/puppeteer-api.js" "{ goto :{ waitUntil :[ load , domcontentloaded , networkidle0 , networkidle2 ]}, viewport :{ width :1024, height :800}, pdf :{ format : A4 , printBackground :true, nodeBinary : C:\\Program Files\\nodejs\\node.exe , orientation : portrait , path : C:\\Users\\x\\AppData\\Local\\Temp\/5d940dadc4c3a2.pdf }, url : file:\/\/C:\\Users\\x\\AppData\\Local\\Temp\/5d940dadc44451.html , nodeBinary : C:\\Program Files\\nodejs\\node.exe , chromeBinary :null}"

Still have no clue why the pdf is not generated. Running on windows 10.

David Winterburn commented on Oct 2, 2019

Hi,

It was our experience that it could be hard to make headless chrome and puppeteer run on many server environment. Therefore we focused cloud export to make export simpler for customers.

For your case we will try to find a way to help phantomjs works with google fonts first on our linux server and let you know the result. If it's impossible we will find other solutions for you. Thanks!

AST commented on Oct 2, 2019

Thanks for your reply, looking forward to it.

David Winterburn commented on Oct 2, 2019

Hi,

That's the default values for when there's no nodeBinary property in your config:

->pdf(array(
       ...
       "nodeBinary" => "C:\\Program Files\\nodejs\\node.exe",
       ...
    ))

To get the direct export command, please go to this line:

$fullCommand = '"' . $this->nodeBinary . '" '
            .escapeshellarg($this->executable). " \"" .addslashes(json_encode($this->config))
                . "\"";

You could print out this command and execute it yourself to see any issue/error there is:

echo $fullCommand; echo '<br>'; exit();

Thanks!

AST commented on Oct 2, 2019

Hello,

I tried it and it returns an error

Array ( [0] => '"node"' is not recognized as an internal or external command, [1] => operable program or batch file. )

I am pretty sure node is installed

PS C:\Users\x\Documents\Project\a> node -v
v10.16.3
AST commented on Oct 2, 2019

Ah great, I get it working except some alignment issue

I change the code into

$fullCommand = 'C:\Progra~1\nodejs\node.exe '
        .escapeshellarg($this->executable). " \"" .addslashes(json_encode($this->config))
            . "\"";

It works, but is it recommended?

David Winterburn commented on Oct 2, 2019

Hi,

Please try:

->pdf(
    ...
    'nodeBinary' => 'C:\Progra~1\nodejs\node.exe',
    ...
)

instead of hardcoding in the source file. Anyway, headless chrome support in Export package is still experimental so we don't know if it would work good enough for you.

On the other hand, I tested a way for phantomjs to work with Google web fonts. Please open the file export/pdf/pdf.js and go to line:

page.setContent(expectedContent,expectedLocation);

Then add this line right before:

page.settings.userAgent = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.97 Safari/537.11';

Finally open your report's pdf view file and add the following lines to the beginning:

<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=PT+Sans&display=swap"> 
<style>
  * {
    font-family: 'PT Sans', sans-serif !important;
  }
</style>

Let me know if this fixes the pdf font on Linux server for you. Thanks!

AST commented on Oct 2, 2019

Hello,

"instead of hardcoding in the source file. Anyway, headless chrome support in Export package is still experimental so we don't know if it would work good enough for you." Noted.

Tried the pdf font, but it does not work on Linux server.

David Winterburn commented on Oct 2, 2019

It's unlucky. I got it to work with phantomjs 2.1.1 on Ubuntu 14.04. May I know your linux and phantomjs versions? And did this line in pdf.js:

page.settings.userAgent = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.97 Safari/537.11';

make a change for your exported pdf file?

Build Your Excellent Data Report

Let KoolReport help you to make great reports. It's free & open-source released under MIT license.

Download KoolReport View demo
help needed

Export