打印到 PDF 时栅格化的 SVG 模式

  • 本文关键字:SVG 模式 PDF 打印 svg
  • 更新时间 :
  • 英文 :


我正在尝试创建一个SVG文件,该文件在打印为PDF时会将其所有部分保留在矢量中。此文件使用模式作为路径的填充,或在下面的示例中用作rect元素的填充:

    <svg
        width="200"
        height="200"
        viewBox="0 0 200 200"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
        className="productWrapper"
      >
        <defs>
          <pattern id="pattern" x="0" y="0" width="1" height="1">
            <path
              fill="#fcc"
              d="[vector path here]"
            />
          </pattern>
        </defs>
        <rect fill="url(#pattern)" stroke="black" width="200" height="200" />
      </svg>

我面临的问题是,当打印为 PDF 时,rect 元素或 SVG 文件顶层的任何path保持矢量,但pattern内的所有矢量内容都被栅格化。

可以在这里找到一个非常小的例子:

https://6j8953j8rn.codesandbox.io/

有什么方法可以让 SVG 在打印到 PDF 时以矢量形式渲染?

从 SVG(包括 <pattern>)转换为 PDF(我将其用作 CLI)后保留矢量信息的一种工具是 https://github.com/typst/svg2pdf

一些在线转换器也可以做到这一点,而我尝试的大多数其他工具都可以在栅格内制作内容<pattern>

最新更新