使用 TCPDF 转换为 PDF 时，SVG 变量显示未定义的索引答案

【问题标题】：SVG variable shows undefined index when converting to PDF using TCPDF使用 TCPDF 转换为 PDF 时，SVG 变量显示未定义的索引
【发布时间】：2018-03-20 13:21:07
【问题描述】：

我有一个 SVG 文件。我正在尝试使用 TCPDF 下载为 PDF 文件。如果 SVG 文件中没有 #，则 SVG 正在转换为 PDF。问题是文件 '#'。请建议我该怎么做。

canvas.svg：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1140" height="600" viewBox="0 0 1140 600" xml:space="preserve">
<desc>Created with Fabric.js 1.7.17</desc>
<defs>
</defs>
<rect x="0" y="0" width="1140" height="600" fill="#ffffff"></rect>
<g clip-path="url(#clipCircle)">
<image xlink:href="http://localhost/canvas/560.jpg" x="-235" y="-280" style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" width="470" height="560" preserveAspectRatio="none" transform="translate(235 280)"></image>
</g>
<clipPath id="clipCircle"><rect x="50" y="120" width="670" height="320" rx="40" ry="40"></rect></clipPath></svg>

pdf.php：

这是我用来将文件下载为 PDF 的文件。

require_once('tcpdf_include.php');

// create new PDF document
$pdf = new TCPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
$pdf->SetPrintHeader(false);
$pdf->SetPrintFooter(false);
$pdf->SetMargins(10, 10, 10, true);
// set font
$pdf->SetFont('helvetica', '', 10);

// add a page
$pdf->AddPage();



$pdf->ImageSVG($file='images/canvas.svg', $x=30, $y=100, $w='', $h=100, $link='', $align='', $palign='', $border=0, $fitonpage=false);


//Close and output PDF document
$pdf->Output('canvasoutput.pdf', 'D');

错误：

注意：未定义的索引：D:\xampp\htdocs\canvas\TCPDF\tcpdf.php 中第 23043 行的 clipCircle

警告：在第 23044 行的 D:\xampp\htdocs\canvas\TCPPDF\tcpdf.php 中为 foreach() 提供的参数无效 TCPDF ERROR: 部分数据已输出，无法发送 PDF 文件

【问题讨论】：

标签： php pdf canvas svg tcpdf

【解决方案1】：

svg 文件在网页中有效，但在我转换为 PDF 时无效。我发现了问题。实际上clipPath 应该包含在defs 中。这是首选的解决方案。它也适用于 TCPDF。

canvas.svg：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1140" height="600" viewBox="0 0 1140 600" xml:space="preserve">
<desc>Created with Fabric.js 1.7.17</desc>
<defs>
//added Here
<clipPath id="clipCircle"><rect x="50" y="120" width="670" height="320" rx="40" ry="40"></rect></clipPath>
</defs>
<rect x="0" y="0" width="1140" height="600" fill="#ffffff"></rect>
<g clip-path="url(#clipCircle)">
<image xlink:href="http://localhost/canvas/560.jpg" x="-235" y="-280" style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" width="470" height="560" preserveAspectRatio="none" transform="translate(235 280)"></image>
</g>
</svg>

【讨论】：