使用 ImageMagick 进行 SVG 到 PNG 转换无法处理 defs?

标签 svg imagemagick

答案在我标记的答案上,但在评论中。基本上,请参见这里:http://www.imagemagick.org/discourse-server/viewtopic.php?f=1&t=18816

在 Mac 上使用 Ports 运行此程序:

sudo port install ImageMagick +rsvg

这是我原来的问题:

我的 test.svg 文件在这里:https://gist.github.com/2727243

Imagemagick版本:ImageMagick 6.7.6-9 2012-05-18 Q16(今天刚刚更新)

我有一个 SVG 文件,它使用 defs -> 符号来定义箭头符号。稍后在文档中我 xlink:use 该符号。这在 Chrome 中运行良好,箭头出现并位于正确的位置:

enter image description here

但是,如果我像这样通过 imagemagick 转换图像:

convert test.svg test.png

这不起作用。这是我得到的:

enter image description here

“use”似乎被完全忽略,相反箭头在 def 处渲染。至少,据我所知。

对于 Imagemagick 处理这种情况,我的 SVG 格式是否错误?或者这只是 Imagemagick 无法正确支持的东西?我一直在寻找明确的答案,但找不到一种、一种方式或另一种方式。

我还在这里尝试了 SVG:http://www.carto.net/svg/samples/symbol.svg并且符号不起作用。所以我倾向于 Imagemagick 是罪魁祸首。

更新:我尝试将 def 更改为以下内容:

<symbol id="arrow" x="25">

在浏览器中,箭头确实向右移动 25,但在 Imagemagick 中它会停留在 (0,0)。这让我相信,这与符号定义无关,而更多与它的翻译不正确有关。但是,即使我尝试对“use”进行直接转换,甚至更好地完全删除“use”,箭头仍然会出现。

最佳答案

更新: 这似乎是 ImageMagick 中默认 SVG 渲染器中的一个错误,它忽略 xyuse标签(并且还忽略 g 标签上的转换属性)。尝试改用 rsvg 后端。

如果你改变它是否有效:

<use xlink:href="#arrow" x="20" y="50"></use>

致:

<g transform="translate(20 50)">
  <use xlink:href="#arrow"></use>
</g>

关于使用 ImageMagick 进行 SVG 到 PNG 转换无法处理 defs?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10658872/

相关文章:

macos - 从图像创建视频的 Imagemagick convert 命令在 Mac 上出现 avconv 错误

linux - 在 Linux 操作系统中更新时自动刷新打开图形(例如显示在 Imagemagick 上)

使用 ImageMagick 进行 R GIF 动画

javascript - 在全局/根坐标中确定 SVG 视口(viewport)

html - 缩放 SVG 以适合 div 内部

jquery - 更改 g 元素(及其所有内容)的宽度以完全适合 SVG 宽度

pdf - 使用imagemagick将pdf文件的所有颜色转换为蓝色

javascript - 在 PaperJS 中平移大 svg 的问题

java - 缩放两个项目

php - 使用 ImageMagick (PHP) 将 2 张并排的图像合并为 1 张