Question

我有以下svg：

<svg xmlns="http://www.w3.org/2000/svg" viewBox="9 9 828 612" width="846" height="630" xmlns:xml="http://www.w3.org/XML/1998/namespace" xml:space="preserve" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <desc>Created with Fabric.js 2.3.0</desc>
    <defs></defs>
    <rect fill="rgb(255, 0, 0)" x="0" y="0" width="100%" height="100%" />
    <polygon style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 0.6;" transform="translate(297.4 360.15) scale(29.61)" points="10,10 -10,10 -10,-10" />
    <g transform="translate(82.75 177.5) rotate(45)">
        <text font-family="Amatic-Bold" font-size="40px" font-style="normal" font-weight="normal" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(207,196,196); fill-rule: nonzero; opacity: 1; white-space: pre;" xml:space="preserve"><tspan x="-78.17" y="12.57">This is a text box</tspan></text>
    </g>
    <polygon style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 0.6;" transform="translate(619.63 230.38) rotate(180) scale(23.13)" points="10,10 -10,10 -10,-10" />
    <g transform="translate(507.63 90) rotate(45)">
         <text font-family="Amatic-Bold" font-size="40px" font-style="normal" font-weight="normal" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(209,196,196); fill-rule: nonzero; opacity: 1; white-space: pre;" xml:space="preserve"><tspan x="-78.17" y="12.57">This is a text box</tspan></text>
    </g>
</svg>

我正在使用TCPDF方法：

$pdf->ImageSvg(@theSvgString, ...);

但是，红色矩形（矩形fill =“ rgb（255，0，0）” x =“ 0” y =“ 0” width =“ 100％” height =“ 100％”）没有显示在生成的pdf

中

Answer 1

问题似乎出在宽度和高度上。设置width =“ 846”和height =“ 630”一切正常。问题是fabric.js生成了错误的部分

svg到pdf的问题，未显示<rect>

1 个答案: