以PDF格式下载带有图像和图案的SVG

Download SVG with image and patterns as PDF

本文关键字：SVG 图像 PDF 格式 下载      更新时间：2023-09-26

我有一个在rects上应用了图像和模式的SVG，如何使用javascript将整个东西下载为PDF？

这是我的代码：http://jsfiddle.net/dnuboz21/5/

<div class="feature">
<svg style="height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;">
    <image width="980" height="600" xlink:href="http://en.hdyo.org/assets/art-shutter-young-people-a12e2c0cd7a54920cb024fd1394190fd.jpg" clip-path="url(#svg-mask)" />
    <defs>
        <pattern width="1" height="1" id="pat1" viewBox="325 110 150 150" preserveAspectRatio="xMidYMid slice">
            <image width="980" height="652" xlink:href="http://en.hdyo.org/assets/art-shutter-young-people-a12e2c0cd7a54920cb024fd1394190fd.jpg" style="filter:url(#svg-blur);" />
        </pattern>
        <filter id="svg-blur">
            <feGaussianBlur stdDeviation="10" />
        </filter>
    </defs>
    <rect x="325" y="110" rx="40" ry="40" width="150" height="150" style="fill:url('#pat1');stroke:red;stroke-width:5;" />
</svg>

您不能仅以PDF格式下载它。要创建PDF，您需要一个PDF工具，如：

  • http://d3export.housegordon.org/
  • https://parall.ax/products/jspdf
  • http://www.wikihow.com/Create-PDF-Files
  • 在PDF中嵌入SVG（使用JS将SVG导出为PDF）

更多信息，例如搜索谷歌创建pdf浏览器

另一种选择是直接打印。今天的许多浏览器都可以选择打印成PDF。

  • 直接从浏览器打印，无需打印弹出窗口
  • https://superuser.com/questions/161313/print-a-huge-svg
相关文章：