使用背景图像从SVG生成PDF

时间:2014-07-14 09:06:44

标签: image pdf ubuntu svg background

问题描述:

我使用Highcharts API来渲染SVG。当我使用像rsvg-convert这样的工具转换它时(我还尝试过imagemagick,graphicsmagick和inkscape),SVG完全呈现在PDF容器中。我在生成的PDF中唯一缺少的是背景图像。

我可以通过将SVG转换为透明PNG然后用背景图像融化来生成PNG / JPG而没有任何问题。当然,我可以把这样一个融化的图像放到PDF容器中,但这不是我想要的。

我需要将SVG保持为透明矢量化图像,JPG或PNG为 background-image ,整个构造在PDF容器中

解决方案方法:

嵌入绝对URL作为背景图像内联样式:

<svg version="1.1" style="font-family: 'Lucida Grande', 'Lucida Sans Unicode',
 Arial, Helvetica, sans-serif; font-size: 12px; color: rgb(68, 68, 68); fill:
 #444444; background-image: url(http://an.absolute.url/image.jpg);"
 xmlns="http://www.w3.org/2000/svg" width="723" height="375">
...
</svg>

结果:渲染时没有背景图像

在SVG中嵌入绝对URL作为图像标记:

<svg version="1.1" ...>
  <defs>
    <image xlink:href="http://an.absolute.url/image.jpg"
           x="0" y="0" width="723" height="375"
           preserveAspectRatio="none"></image>
    ...
  </defs>
  ...
</svg>

结果:渲染时没有背景图像

嵌入为base64编码的背景图像为内联样式:

<svg version="1.1" style="font-family: 'Lucida Grande', 'Lucida Sans Unicode',
 Arial, Helvetica, sans-serif; font-size: 12px; color: rgb(68, 68, 68); fill:
 #444444; background-image: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAlgCWAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wgARCAGQAmwDASIAAhEBAxEB/8QAHAAAAwEBAQEBAQAAAAAAAAAAAwQFAgYBAAcJ/8QAGQEAAwEBAQAAAAAAAAAAAAAAAAECAwQF/9oADAMBAAIQAxAAAAH+7JxvNfA2YShQjqXEfWZY8+4HlgNAQMvR4ujtYzAMK0Ws+/...inDlwJRZerdtbi5TYwq7PRqadq//9k=);"
 xmlns="http://www.w3.org/2000/svg" width="723" height="375">
...
</svg>

结果:渲染时没有背景图像

问题:

有人知道如何在Ubuntu shell上解决这个问题吗?我使用PHP的exec函数来执行shell命令,我可以在将SVG传递给shell执行进程之前对其进行修改。请原谅我现在没有提供更多信息,我希望尽可能缩短问题本身,但要详细回答你的问题。

0 个答案:

没有答案