使用 SVGtoPDF (SVG-to-PDFKit) 将 svg 数据转换为 pdf答案

【问题标题】：Convert svg data into pdf using SVGtoPDF (SVG-to-PDFKit)使用 SVGtoPDF (SVG-to-PDFKit) 将 svg 数据转换为 pdf
【发布时间】：2020-12-14 06:07:55
【问题描述】：

我正在使用 SVGtoPDF npm 库来获取 pdf 上的 svg 元素，但是对于跟随 svg 对象它不起作用，因为 <image> 标签正在产生问题。

错误消息：：SVGElemImage：无法在 PDFKit 中打开图像“http://174.138.12.68:4000/uploads/products/1597070187552-Ash%20Back.jpg”

我的 SVG 数据:::

<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="400" height="400" viewBox="0 0 400 400" xml:space="preserve">
<desc>Created with Fabric.js 2.7.0</desc>
<defs>
</defs>
<g transform="matrix(0.31 0 0 0.31 200 200)"  >
    <image style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;"  xlink:href="http://174.138.12.68:4000/uploads/products/1597070187552-Ash%20Back.jpg" x="-512" y="-640" width="1024" height="1280"></image>
</g>
<g transform="matrix(1 0 0 1 206.5 263.5)"  >
<rect style="stroke: rgb(0,0,255); stroke-width: 3; stroke-dasharray: 7 7; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(230,230,230); fill-opacity: 0.8; fill-rule: nonzero; opacity: 0.2;"  x="-100" y="-100" rx="0" ry="0" width="200" height="200" />
</g>
<g clip-path="url(#CLIPPATH_4)"  >
<g transform="matrix(0.9 0 0 0.9 205 244.88)"  >
<clipPath id="CLIPPATH_4" >
    <rect transform="matrix(1 0 0 1 206.5 263.5)" x="-100" y="-100" rx="0" ry="0" width="200" height="200" />
</clipPath>
    <image style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;"  xlink:href="http://174.138.12.68:4000/transparent_images/1598349009675-1589379674035GoogleFiveStarCust.Rating.pdf-1.svg" x="-111" y="-92" width="222" height="184"></image>
</g>
</g>
</svg>

【问题讨论】：

标签： svg fabricjs pdfkit node-pdfkit

【解决方案1】：

我认为远程图像导入仍然没有实现。您可以做的是下载图像并替换 svg 中的路径并导出。这对我有用，因为我的原始 svg 引用了本地图像，我没有遇到这个问题。

【讨论】：