Search code examples
htmlfontsmpdfcjk

mPDF Japanese font configuration


I need to generate a PDF using mPDF and YuGothM.ttc font for a Japanese client. The page I need to export in PDF contains some text which in browser version (HTML) is rendered well, but in the PDF, the same text has some characters using a font and other characters some default font which is not approved by the client. I understand I have to define TTCfontID parameter in every font definition for .ttc files, but I just don't understand the meanings of those definitions and so how to properly configure fonts.

The script is used in a WordPress website using Polylang plugin for translations.

$defaultConfig = (new \Mpdf\Config\ConfigVariables())->getDefaults();
$fontDirs = $defaultConfig['fontDir'];

$defaultFontConfig = (new \Mpdf\Config\FontVariables())->getDefaults();
$fontData = $defaultFontConfig['fontdata'];

$pdf = new \Mpdf\Mpdf([
    //'mode' => '+aCJK',
    'mode' => 'utf-8',
    'format' => 'A3-L',
    'margin_left' => 5,
    'margin_right' => 5,
    'margin_top' => 5,
    'margin_bottom' => 5,

    'fontDir' => array_merge($fontDirs, [
        ASSETS_DIR ."fonts/Yugothib/",
    ]),

    'fontdata' => $fontData + [
        'yugoth' => [
            'R' => 'YuGothR.ttc',
            'TTCfontID' => [
                'R' => 1,
            ]
        ],
    ],
    'default_font' => 'yugoth',
    'languageToFont' => new CustomLanguageToFontImplementation()
]);

$pdf->autoScriptToLang  = true;
$pdf->autoLangToFont  = true;
$pdf->showImageErrors = true;
$pdf->allow_charset_conversion = true;
        
$pdf->SetHTMLHeader();
$pdf->SetHTMLFooter();
$pdf->WriteHTML($this->getHtmlTemplate($stock, $userId, $loadedDate));

$pdf->Output($filepath, 'F');

And the HTML is also taken from a private function within the same class

function getHtmlTemplate($records, $userId, $loadedDate){
    $user = $this->getUserInfo($userId);

    $companyName = $user->client;

    $html = "
<html lang=\"ja\">
<head>
<style>
.table {
    font-family: 'yugoth', sans-serif; 
    font-size: 16px;
    font-weight: normal;
}
.column-header {
    text-align: center;
    vertical-align: middle;
    background-color: #777777;
    color: #FFFFFF;
}
.cell{
    border-left: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
}
.cell-last {
    border-right: 1px solid #efefef;
}
.a-center {
    text-align: center;
}
.w-80 {
    width: 80px;
}
.w-quality {
    width: 380px;
}
.w-150 {
    width: 150px;
}
</style>
</head>
<body lang=\"ja\">

<table border=\"0\" style=\"width: 100%\">
<tr>
    <td style=\"width:26%; text-align: left; font-size: 18px\">
        <div>" . $companyName ."</div><br />
        <div lang='ja'>" . pll__('Stock Info') ."</div>
    </td>
    <td class=\"a-center\" style=\"width:26%\">
        <div style=\"font-size: 50px; color: #004729; font-weight: bold;\" lang='ja'>" . pll__('Stock Report'). "</div>
    </td>
    <td style=\"width:26%; text-align: right\">
        <div>". $date ."</div><br />
        <img src=\"" . ASSETS_URL . "images/logo.png\" width=\"200px\" />
    </td>
</tr>
</table>

<table class=\"table\" border=\"0\" cellpadding=\"7\">
    <thead>
        <tr>
            <th class=\"column-header\" style=\"width: 100px\">" . pll__("Col 1") ."</th>
            <th class=\"column-header\" style=\"width: 100px\">" . pll__("Col 2") ."</th>
            <th class=\"column-header w-150\">" . pll__("Col 3") ."</th>
            <th class=\"column-header w-quality\">" . pll__("Col 4") . "</th>
            <th class=\"column-header\" style=\"width: 100px\">" . pll__("Col 5") . "</th>
            <th class=\"column-header w-80\">" . pll__("Col 6") . "</th>
            <th class=\"column-header\" style=\"width: 130px\">" . pll__("Col 7") . "</th>
            <th class=\"column-header\">" . pll__("Col 8") . "</th>
            <th class=\"column-header\">" . pll__("Col 9") . "</th>
            <th class=\"column-header\" style=\"width: 100px\">" . pll__("Col 10") . "</th>
            <th class=\"column-header\">" . pll__("Col 11") . "</th>
            <th class=\"column-header\" style=\"width: 120px\">" . pll__("Coll 12") . "</th>
            <th class=\"column-header w-150\">" . pll__("Col 13") . "</th>
            <th class=\"column-header w-150\">" . pll__("Col 14") . "</th>
        </tr>
    </thead>
    <tbody>
";

    /** @var StockItem $row */
    foreach ($records as $row){
        $html .= "
    <tr>
        <td class=\"cell a-center\">" . $row->col1 ."</td>
        <td class=\"cell a-center\">".$row->col2."</td>
        <td class=\"cell a-center w-150\">". $row->col3 ."</td>
        <td class=\"cell w-quality\">".$row->col4."</td>
        <td class=\"cell w-150\">".$row->col5."</td>
        <td class=\"cell a-center w-80\">".$row->col6."</td>
        <td class=\"cell a-center w-80\">".$row->col7."</td>
        <td class=\"cell a-center\" lang='ja'>".$row->col8."</td>
        <td class=\"cell a-center\">".$row->col9."</td>
        <td class=\"cell a-center\">".$row->col10."</td>
        <td class=\"cell a-center\">".$row->col11."</td>
        <td class=\"cell a-center w-80\">".$row->col12."</td>
        <td class=\"cell a-center w-150\">".$row->col13."</td>
        <td class=\"cell cell-last a-center w-150\">".$row->col14."</td>
    </tr>";
    }

    $html .= "
</tbody>
</table>
</body>
</html>
";

        return $html;
    }
}

Can someone help me with a proper configuration for mPDF or suggest some other configuration with other Japanese font which is already working?

Thanks in advance!


Solution

  • Eventually I've changed the script to use TCPDF and this way has actually worked very nice. I know this answer did not respond to the question I've asked, but it solved my problem.