使用自定义 svg 具有多个停止的 Imagemagick 对角线性渐变答案

【问题标题】：Imagemagick diagonal linear gradient with multiple stops using custom svg使用自定义 svg 具有多个停止的 Imagemagick 对角线性渐变
【发布时间】：2020-10-31 07:16:27
【问题描述】：

我正在尝试使用自定义 svg 创建对角线线性渐变背景，但 ImageMagick 无法识别 svg 上指定的渐变路径。渐变应该从左上角开始，到右下角结束。

第一种方法
我试过使用$imagick->newPseudoImage(600, 600, 'gradient:startColor-endColor')，但它不支持渐变中的多个停靠点。但是，它确实支持使用 $imagick->setOption('vector', '0,0,600,600') 的对角线 - 左上角到右下角

第二种方法
第二种方法是创建一个内联 svg（指定渐变）并将其提供给 Imagick，但 svg 解析器无法识别指定的对角线路径，并且默认为垂直 og 水平渐变。但是，它确实支持多个色标（偏移）。下面是使用的 svg 以及生成的图像。

<svg xmlns="http://www.w3.org/2000/svg" width="600px" height="600px" >
    <defs>
         <linearGradient id="gradient" x1="0%" y1="0%" x2="100%" y2="100%">
               <stop offset="0%" stop-color="black"/>
               <stop offset="50%" stop-color="red"/>
               <stop offset="100%" stop-color="orange"/>
         </linearGradient>
    </defs>
    <rect x="0" y="0" width="100%" height="100%" fill="url(#gradient)"/>
</svg>

$image = new Imagick();
$image->readImageBlob($svg);
$image->setImageFormat("svg");

我真的很喜欢将 svg 提供给 Imagick 的想法，但我不确定如何解决这个问题。

希望有人可以帮助我。

【问题讨论】：

第二种方法是否支持gradientTransform？如果不是，“svg 解析器无法识别指定的对角线路径”是什么意思
在第二种方法中，梯度路径（向量）是(0,0) -> (600,600)，但是梯度是从(0,0) -> (0, 600)绘制的跨度>
还有梯度变换？
您可以试试这个：<linearGradient id="gradient" gradientTransform = "rotate(30 .5 .5)"> 请阅读有关 gradientTransform 的更多信息
我无法使用 gradientTransform

标签： svg imagemagick gradient

【解决方案1】：

我的解决方案是使用安装 inkscape

brew install inkscape

如果在您的路径中找到，ImageMagick 将尝试使用 inkscape 或 RSVG。否则，它将默认使用它自己的内部 svg 渲染器。

【讨论】：