时间戳

首页 > 解决方案 > 使用自定义 svg 具有多个停靠点的 Imagemagick 对角线线性渐变

svg - 使用自定义 svg 具有多个停靠点的 Imagemagick 对角线线性渐变

问题描述

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


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

第二种方法
第二种方法是创建一个内联svg（指定渐变）并将其提供给Imagick，但是svg解析器不识别指定的对角线路径并且默认为垂直或水平渐变。但是，它确实支持多个色标（偏移）。下面是使用的 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 的想法，但我不确定如何解决这个问题。

希望可以有人帮帮我。

标签： svgimagemagickgradient

解决方案

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

brew install inkscape

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

推荐阅读