php - 如何剪切svg的白色部分？

Question

我有一个脚本可以在 SVG 文件的中心生成一个 SVG 图像文件和其他内容。在这些图像周围 - 白色背景。如何修剪背景？ SVG 中的图像大小可能不同。

示例 — 我想从 svg 中删除白色区域并仅保留蓝色图像。

Answer 1

这里的大多数人都在寻找与您的问题完全相反的问题，因为 svg 不允许设置那些 background-xxx他们熟悉使用 html 的属性。从以下代码片段中可以看出，没有对背景的内置支持，其中 div 中的文本闪耀:

div {
    position: absolute;
    top: 50px;
    left: 0px;
}

svg {
    position: absolute;
    top: 20px;
    left: 20px;
    outline: 1px black solid;
}

rect {
    fill: steelblue;
}

<div>
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

<svg width="300" height="300">
    <rect x="50" y="50" width="200" height="200" />
</svg>

如果您的 svg 中有白色背景，您很可能会找到全尺寸的 <rect width="100%" height="100%" fill="white"/>或类似的提供背景。要摆脱背景，您可以:

1. 设置fill="none"在你的 rect .

   <rect width="100%" height="100%" fill="none"/>
   

2. 删除 <rect>完全。但是，如果您正在编写脚本，这也会删除附加到它的所有事件监听器。