Question

我正在使用TCPDF将html转换为PDF。

    $pdf = new TCPDF();
    $pdf->SetPrintHeader(false);
    $pdf->SetPrintFooter(false);
    $pdf->AddPage();       

    $html  = '<div>Some random html </div>';        
    $pdf->writeHTML($html, true, false, true, false, '');
    $pdf->Output('/pdf/output.pdf','F');

它就像一个魅力。

但我有一个案例，当（动态）html也有SVG内联代码。所以我需要将具有SVG的这个html转换为PDF。但它不起作用。以下是我的代码。

    $pdf = new TCPDF();
    $pdf->SetPrintHeader(false);
    $pdf->SetPrintFooter(false);
    $pdf->AddPage();       

    $html  = '<div>Some random html <div style="width: 100px;"><svg viewBox="10 0 80 80">
    <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:purple" />
    <ellipse cx="220" cy="70" rx="190" ry="20" style="fill:lime" />
    <ellipse cx="210" cy="45" rx="170" ry="15" style="fill:yellow" />
    Sorry, your browser does not support inline SVG. 
    </svg></div> </div>';        
    $pdf->writeHTML($html, true, false, true, false, '');
    $pdf->Output('/pdf/output.pdf','F');

因此，在这种情况下，生成的PDF包含所有以pdf格式打印的html，但代替SVG，它显示“抱歉，您的浏览器不支持内联SVG”。

有没有办法从包含SVG的html生成PDF？

更新我发现http://www.pdfy.net/此网站可以将基于html的svg转换为PDF。知道他们是怎么做的吗？

编辑1：

好的现在我发现mPDF支持内联SVG。它对它有很大的支持。但 mPDF有自己的问题，基本的CSS支持非常少。对于Eg。绝对位置，浮点数不太受支持。

所以我再次提出了额外要求的相同问题。一个支持将带有内联svg的html转换为PDF的库，它还支持所有基本的CSS。

Answer 1

解决方案＃1-将svg保存到文件

您可以将svg HTML部分保存到文件中。然后，您可以使用svg功能将$pdf->ImageSVG()图像添加到PDF中，如here所示。

$pdf->ImageSVG($file='path/to/testsvg.svg', $x=15, $y=30, $w='', $h='', $link='http://www.tcpdf.org', $align='', $palign='', $border=1, $fitonpage=false);

$pdf->Write(0, $txt='', '', 0, 'L', true, 0, false, false, 0);

解决方案＃2-添加内联svg

您可以将内联svg存储到变量中（例如$svgString）：

$svgString = '<svg viewBox="10 0 80 80">
<ellipse cx="240" cy="100" rx="220" ry="30" style="fill:purple" />
<ellipse cx="220" cy="70" rx="190" ry="20" style="fill:lime" />
<ellipse cx="210" cy="45" rx="170" ry="15" style="fill:yellow" />
Sorry, your browser does not support inline SVG. 
</svg>';

然后您可以将$svgString变量添加到PDF中，如下所示：

$pdf->ImageSVG('@' . $svgString, $x=15, $y=30, $w='', $h='', $link='http://www.tcpdf.org', $align='', $palign='', $border=1, $fitonpage=false);

$pdf->Write(0, $txt='', '', 0, 'L', true, 0, false, false, 0);

Answer 2

使用TCPDF的一个解决方案是，可以将svg作为源内容放置在HTML内联中。

如果你看一下TCPDF的例子06，那就是如何在$ writeHTML中内联svg： https://github.com/tecnickcom/TCPDF/blob/95c5938aafe4b20df1454dbddb3e5005c0b26f64/examples/example_006.php#L112

使用它可以解析你的html字符串，或者更改源代码以匹配在浏览器和pdf中都有效的语法（参见https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web#The_quick_way_）。

Answer 3

@Soroush

您仅错过了我要在您的代码中添加的一条语句，希望对我有所帮助，我对其进行了测试，并且100％正常工作。

    $svgString = '<svg viewBox="10 0 80 80">
    <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:purple" />
    <ellipse cx="220" cy="70" rx="190" ry="20" style="fill:lime" />
    <ellipse cx="210" cy="45" rx="170" ry="15" style="fill:yellow" />
    Sorry, your browser does not support inline SVG. 
    </svg>';

    $pdf->ImageSVG('@' . $svgString, $x=15, $y=30, $w='', $h='',         $link='http://www.tcpdf.org', $align='', $palign='', $border=1, $fitonpage=false);  
    $pdf->Write(0, $txt='', '', 0, 'L', true, 0, false, false, 0);
    $pdf->Output('networth-and-cashflow-document.pdf', 'D'); // This will download PDF

Answer 4

我认为最好的方法是使用tcpdf方法TAG在HTML代码内部使用ImageSVG。

对于SVG，这是一个示例：

 // Create the SVG on a string
$svgString .= "<svg width=\"100\" height=\"100\">";
$svgString .= "<circle cx=\"50\" cy=\"50\" r=\"40\" stroke=\"green\" stroke-width=\"4\" fill=\"yellow\" />";
$svgString .= "</svg>";

// Prepare the parameters for the function
$params = $pdf->serializeTCPDFtagParameters(array('@' . $svgString, $x='', $y='', $w='', $h='', $link='http://www.tcpdf.org', $align='', $palign='', $border=1, $fitonpage=false));

// Declare the tag with the name of the function yu want to call and add the parameters
$tcpdf_start1 .= '<tcpdf method="ImageSVG" params="'.$params.'" />';

 // Prepare your HTML code inside of which you just insert the special TAG
$code_html  = "";
$code_html .= "<h1>My first SVG</h1>";
$code_html .= "<table border=\"1\">";
$code_html .= "<tr><td style=\"text-align: center;\">Top</td></tr>";
$code_html .= "<tr><td>".$tcpdf_start1."</td></tr>";
$code_html .= "</table>";

// Basicly produce your PDF with the parameters of your choice.
$pdf->writeHTML($code_html, $ln, $fill, $reseth, $cell, '');

TCPDF将带有html的内联SVG转换为PDF

4 个答案: