Imagemagick翻转LinearGradient的方向

Question

我已经实现了一个go脚本，可以根据json输入文件生成自定义游戏卡。输出是svg。为了打印卡，我需要将其转换为png。因此我安装了ImageMagick。

我正在使用转换命令行工具：

convert output.svg output.png

这是svg标记：

<?xml version="1.0"?>
<!-- Generated by SVGo -->
<svg width="630" height="891"
     xmlns="http://www.w3.org/2000/svg" 
     xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="h" x1="0%" y1="100%" x2="0%" y2="0%">
<stop offset="0%" stop-color="red" stop-opacity="1.00"/>
<stop offset="100%" stop-color="rgb(255,255,255)" stop-opacity="1.00"/>
</linearGradient>
</defs>
<rect x="0" y="0" width="630" height="891" style="fill:black"/>
<rect x="10" y="10" width="610" height="871" style="fill:url(#h)"/>
<text x="20" y="89" style="fill:black;font-size:30pt;text-anchor:start">1 Sold</text>
<text x="610" y="89" style="fill:black;font-size:30pt;text-anchor:end">Gegenstand</text>
<line x1="20" y1="98" x2="610" y2="98" style="stroke:black;stroke-width:3"/>
<text x="20" y="151" style="font-family:monospace;fill:black;font-size:25pt;text-anchor:start">Bogen</text>
<text x="20" y="534" style="fill:black;font-size:20pt;text-anchor:start">Wird in einer Schmiede hergestellt</text>
<text x="20" y="579" style="fill:black;font-size:20pt;text-anchor:start"></text>
<text x="20" y="623" style="fill:black;font-size:15pt;text-anchor:start">Vor dem Kampf hat der Bogenschütze eine Wahrscheinlichkeit</text>
<text x="20" y="641" style="fill:black;font-size:15pt;text-anchor:start">von 4,5,6 dass der dem Gegner einen Lebenspunkt abzieht</text>
</svg>

如果将其粘贴到svg文件中并在浏览器中打开，则可以看到背景是带有线性渐变的矩形。卡的底部是红色的，朝顶部慢慢变成白色。将文件转换为png后，它看起来像这样：

卡上的语言是德语，但文字并不重要。它正确呈现。问题是倒梯度。起初我用Gimp设计了卡片，但后来我决定自动化这个过程。不幸的是，我已经打印了很多这些卡片，并且希望保持布局一致。

我很确定翻转的渐变不是我的错。 Chrome，Firefox和Internet Explorer显示相同的图片。也许我对ImageMagick的使用是错误的？

你能推荐一种替代工具吗？

Answer 1

如果更改linarGradient使y1 =“0％”并且y2 =“100％”，则交换停止颜色的偏移量，您可以在ImageMagick中解决该错误。